ساختنه کده loading با جاوا اسکریپت برایه صفحه یه مشخص یا سایت
خوب اول از همه نمونه یه کار:
کد:
http://javascriptkit.com/script/script2/preload.htm
حالا میریم سراغه کدها:
اینو تو قسمته head کپی/پیست کنید! مقداری توضیحاته لازم رو هم دادم
نقل قول:
<script language="JavaScript1.2">
<!-- begin hiding
// (C) 2000 Marcin P Wojtowicz [one_spook@hotmail.com]. All rights reserved.
// Obtain permission before selling/redistributing in any medium.
startingColor = new Array() // <-- Do not modify!
endingColor = new Array() // <-- Do not modify!
// YOU MAY MODIFY THE FOLLOWING:
var yourImages = new Array("avalintasvir.jpg","dovomintasvir.gif","3vom intasvir.png") // عکسهایی که میخواید لود بشن همراه با آدرسه کامل و فرمت تویه قسمتهایه مخصوص قرار بدید من برایه مثال 3 عکس با 3 فرمته مختلف قرار دادم
var locationAfterPreload = "???.html" // آدرسه صفحه ای رو که باید بعد از اینکه عکسها لود شد بره رو اینجا بزارید
var preloadbarWidth = 250 // The length of the preload bar. Should be greater than total amount of images you want to preload!
var preloadbarHeight = 15 // The height of the gradient/preload bar
var backgroundOfGradient = "#000000" // Default color while the preload bar is "filling up" رنگه پس ضمینه یه مکانه لود قبل از پر شدن
// Color the preloadbar is starting with - enter 1st, 3rd and 5th numbers/letters of color code
startingColor[0] = "c"
startingColor[1] = "f"
startingColor[2] = "f"
// Color the preloadbar is going to end up with - enter the 1st, 3rd and 5th numbers/letters of color code
endingColor[0] = "c"
endingColor[1] = "0"
endingColor[2] = "0"
// FOR TROUBLESHOOTING:
var gap = 5 // PLAY AROUND WITH THIS SETTING IF YOU GET A JAVASCRIPT ERROR!!! 2 is the minumum value!!! اگه وارد نیستید با این هم کاری نداشته باشید
// دیگه با از اینجا به پایین کاری نداشته باشید
if (!doent.all) location.replace(locationAfterPreload)
var a = 10, b = 11, c = 12, d = 13, e = 14, f=15, i, j, ones = new Array(), sixteens = new Array(), diff = new Array();
var convert = new Array("0","1","2","3","4","5","6","7","8","9","a", "b","c","d","e","f"), imgLen = yourImages.length;
var loaded = new Array(), preImages = new Array(), currCount = 0, pending = 0, h = 0, hilite = new Array(), cover = new Array();
var num = Math.floor(preloadbarWidth/gap);
for (i = 0; i < 3; i++) {
startingColor[i] = startingColor[i].toLowerCase();
endingColor[i] = endingColor[i].toLowerCase();
startingColor[i] = eval(startingColor[i]);
endingColor[i] = eval(endingColor[i]);
diff[i] = (endingColor[i]-startingColor[i])/num;
ones[i] = Math.floor(diff[i]);
sixteens[i] = Math.round((diff[i] - ones[i])*15);
}
endingColor[0] = 0;
endingColor[1] = 0;
endingColor[2] = 0;
i = 0, j = 0;
while (i <= num) {
hilite[i] = "#";
while (j < 3) {
hilite[i] += convert[startingColor[j]];
hilite[i] += convert[endingColor[j]];
startingColor[j] += ones[j];
endingColor[j] += sixteens[j];
if (endingColor[j] > 15) {
endingColor[j] -= 15;
startingColor[j]++;
}
j++;
}
j = 0;
i++;
}
function loadImages() {
for (i = 0; i < imgLen; i++) {
preImages[i] = new Image();
preImages[i].src = yourImages[i];
loaded[i] = 0;
cover[i] = Math.floor(num/imgLen)*(i+1)
}
cover[cover.length-1] += num%imgLen
checkLoad();
}
function checkLoad() {
if (pending) { changeto(); return }
if (currCount == imgLen) { location.replace(locationAfterPreload); return }
for (i = 0; i < imgLen; i++) {
if (!loaded[i] && preImages[i].complete) {
loaded[i] = 1; pending++; currCount++;
checkLoad();
return;
}
}
setTimeout("checkLoad()",10);
}
function changeto() {
if (h+1 > cover[currCount-1]) {
var percent = Math.round(100/imgLen)*currCount;
if (percent > 100) while (percent != 100) percent--;
if (currCount == imgLen && percent < 100) percent = 100;
defaultStatus = "Loaded " + currCount + " out of " + imgLen + " images [" + percent + "%].";
pending--;
checkLoad();
return;
}
eval("doent.all.cell" + (h+1) + ".style.backgroundColor = hilite[h]");;
h++;
setTimeout("changeto()",1);
}
defaultStatus = "Loaded 0 out of " + imgLen + " images [0%]."
// end hiding -->
</script>
قسمتهایه اضافه رو بعدا میتونید پاک کنید و مطالبه خودتون رو بزارید...
نقل قول:
<font face="Verdana, Arial, Helvetica" size="2"><center>Preloading Images... Please Wait..</center>
<script language="JavaScript1.2">
<!-- beging hiding
doent.write('<table border="0" cellpadding="0" cellspacing="0" width="' + preloadbarWidth + '"><tr height="' + preloadbarHeight + '" bgcolor="' + backgroundOfGradient + '">');
for (i = 0; i < num; i++) {
doent.write('<td width="' + gap + '" id="cell' + (i+1) + '"></td>');
}
doent.write('</tr></table>');
doent.write('<p><small><a href="javascript:location.replace(locationAfterPre load)">Skip Preloading</a></small></p></font>')
loadImages();
// end hiding -->
</script>
اگه کدها احیانا اشکالی داشت که ممکنه از فروم باشه مستقیم به این صفحه برید و صفحه یه preload.htm رو save کنید:
کد:
http://www.javascriptkit.com/script/script2/preloadimage2.shtml
موفق باشید...
پاسخ با نقل قول
علاقه مندی ها (بوک مارک ها)