W
white lightning
I have a simple piece of code that does the preloading of images... i
got it from dynamic drive website.
In the code below, <font size="4" id="preload_area">Please be patient
while some images are being preloaded...</font>, once the preloading
is done, I want to be able to replace the above text with another
text... I tried to do this:
document.getElementById("preload_area").innerHTML = "Done"; but it
doesn't work...
How can i get it work?
the enitre code is below:
<html>
<head>
<title>Preload Image Page</title>
<script language="JavaScript1.1">
<!-- begin hiding
/*
Preload Image With Update Bar Script (By Marcin Wojtowicz
[[email protected]])
Submitted to and permission granted to Dynamicdrive.com to feature
script in it's archive
For full source code to this script and 100's more, visit http://dynamicdrive.com
*/
// You may modify the following:
//var locationAfterPreload = "http://www.hotmail.com" // URL of the
page after preload finishes
var lengthOfPreloadBar = 150 // Length of preload bar (in pixels)
var heightOfPreloadBar = 15 // Height of preload bar (in pixels)
// Put the URLs of images that you want to preload below (as many as
you want)
var yourImages = new Array("http://tbn0.google.com/images?
q=tbn:_fmklChPp2nVSM:http://www.marcreichelt.de/spezial/firefox/
firefox_huge.png","http://tbn0.google.com/images?
q=tbn:WRDX3Ie8qhmgaM:http://mkweb.bcgsc.ca/circos/images/circos-sample-
huge-15.png", "http://tbn0.google.com/images?
q=tbn
OajcO-5Qh0BMM:http://www.imaging-resource.com/PRODS/XTI/
zxti_seethru_huge.jpg", "http://images.google.com.au/imgres?
imgurl=http://www-f9.ijs.si/~matevz/alice/imgpprd0/d0-bac-z2-
huge.png&imgrefurl=http://www-f9.ijs.si/~matevz/alice/imgpprd0/
&h=3504&w=4779&sz=5251&hl=en&start=34&tbnid=j89QabPXfXISAM:&tbnh=110&tbnw=150&prev=/
images%3Fq%3Dhuge%2Bimage%26start%3D18%26gbv%3D2%26ndsp%3D18%26svnum
%3D10%26hl%3Den%26client%3Dfirefox-a%26channel%3Ds%26rls
%3Dorg.mozilla:en-USfficial%26sa%3DN");
// Do not modify anything beyond this point!
if (document.images) {
var dots = new Array()
dots[0] = new Image(1,1)
dots[0].src = "black.gif" // default preloadbar color (note: You can
substitute it with your image, but it has to be 1x1 size)
dots[1] = new Image(1,1)
dots[1].src = "blue.gif" // color of bar as preloading progresses
(same note as above)
var preImages = new Array(),coverage = Math.floor(lengthOfPreloadBar/
yourImages.length),currCount = 0
var loaded = new Array(),i,covered,timerID
var leftOverWidth = lengthOfPreloadBar%coverage
}
function loadImages() {
for (i = 0; i < yourImages.length; i++) {
preImages = new Image()
preImages.src = yourImages
}
for (i = 0; i < preImages.length; i++) {
loaded = false
}
checkLoad()
}
function checkLoad() {
if (currCount == preImages.length) {
location.replace(locationAfterPreload)
return
}
for (i = 0; i <= preImages.length; i++) {
if (loaded == false && preImages.complete) {
loaded = true
eval("document.img" + currCount + ".src=dots[1].src")
currCount++
}
}
timerID = setTimeout("checkLoad()",10)
}
// end hiding -->
</script>
</head>
<body bgcolor="#FFFFFF">
<center>
<font size="4" id="preload_area">Please be patient while some images
are being preloaded...</font><p>
0%
<script language="JavaScript1.1">
<!-- begin hiding
// It is recommended that you put a link to the target URL just in
case if the visitor wants to skip preloading
// for some reason, or his browser doesn't support JavaScript image
object.
if (document.images) {
var preloadBar = ''
for (i = 0; i < yourImages.length-1; i++) {
preloadBar += '<img src="' + dots[0].src + '" width="' + coverage +
'" height="' + heightOfPreloadBar + '" name="img' + i + '"
align="absmiddle">'
}
preloadBar += '<img src="' + dots[0].src + '" width="' +
(leftOverWidth+coverage) + '" height="' + heightOfPreloadBar + '"
name="img' + (yourImages.length-1) + '" align="absmiddle">'
document.write(preloadBar)
loadImages()
}
document.getElementById("preload_area").innerHTML = "Done";
// end hiding -->
</script>
</center>
</body>
</html>
If you want to run the code, you need to have images. you can get the
bar.zip file from http://www.dynamicdrive.com/dynamicindex4/preloadimage.htm
thanks
got it from dynamic drive website.
In the code below, <font size="4" id="preload_area">Please be patient
while some images are being preloaded...</font>, once the preloading
is done, I want to be able to replace the above text with another
text... I tried to do this:
document.getElementById("preload_area").innerHTML = "Done"; but it
doesn't work...
How can i get it work?
the enitre code is below:
<html>
<head>
<title>Preload Image Page</title>
<script language="JavaScript1.1">
<!-- begin hiding
/*
Preload Image With Update Bar Script (By Marcin Wojtowicz
[[email protected]])
Submitted to and permission granted to Dynamicdrive.com to feature
script in it's archive
For full source code to this script and 100's more, visit http://dynamicdrive.com
*/
// You may modify the following:
//var locationAfterPreload = "http://www.hotmail.com" // URL of the
page after preload finishes
var lengthOfPreloadBar = 150 // Length of preload bar (in pixels)
var heightOfPreloadBar = 15 // Height of preload bar (in pixels)
// Put the URLs of images that you want to preload below (as many as
you want)
var yourImages = new Array("http://tbn0.google.com/images?
q=tbn:_fmklChPp2nVSM:http://www.marcreichelt.de/spezial/firefox/
firefox_huge.png","http://tbn0.google.com/images?
q=tbn:WRDX3Ie8qhmgaM:http://mkweb.bcgsc.ca/circos/images/circos-sample-
huge-15.png", "http://tbn0.google.com/images?
q=tbn
OajcO-5Qh0BMM:http://www.imaging-resource.com/PRODS/XTI/zxti_seethru_huge.jpg", "http://images.google.com.au/imgres?
imgurl=http://www-f9.ijs.si/~matevz/alice/imgpprd0/d0-bac-z2-
huge.png&imgrefurl=http://www-f9.ijs.si/~matevz/alice/imgpprd0/
&h=3504&w=4779&sz=5251&hl=en&start=34&tbnid=j89QabPXfXISAM:&tbnh=110&tbnw=150&prev=/
images%3Fq%3Dhuge%2Bimage%26start%3D18%26gbv%3D2%26ndsp%3D18%26svnum
%3D10%26hl%3Den%26client%3Dfirefox-a%26channel%3Ds%26rls
%3Dorg.mozilla:en-US
fficial%26sa%3DN");// Do not modify anything beyond this point!
if (document.images) {
var dots = new Array()
dots[0] = new Image(1,1)
dots[0].src = "black.gif" // default preloadbar color (note: You can
substitute it with your image, but it has to be 1x1 size)
dots[1] = new Image(1,1)
dots[1].src = "blue.gif" // color of bar as preloading progresses
(same note as above)
var preImages = new Array(),coverage = Math.floor(lengthOfPreloadBar/
yourImages.length),currCount = 0
var loaded = new Array(),i,covered,timerID
var leftOverWidth = lengthOfPreloadBar%coverage
}
function loadImages() {
for (i = 0; i < yourImages.length; i++) {
preImages = new Image()
preImages.src = yourImages
}
for (i = 0; i < preImages.length; i++) {
loaded = false
}
checkLoad()
}
function checkLoad() {
if (currCount == preImages.length) {
location.replace(locationAfterPreload)
return
}
for (i = 0; i <= preImages.length; i++) {
if (loaded == false && preImages.complete) {
loaded = true
eval("document.img" + currCount + ".src=dots[1].src")
currCount++
}
}
timerID = setTimeout("checkLoad()",10)
}
// end hiding -->
</script>
</head>
<body bgcolor="#FFFFFF">
<center>
<font size="4" id="preload_area">Please be patient while some images
are being preloaded...</font><p>
0%
<script language="JavaScript1.1">
<!-- begin hiding
// It is recommended that you put a link to the target URL just in
case if the visitor wants to skip preloading
// for some reason, or his browser doesn't support JavaScript image
object.
if (document.images) {
var preloadBar = ''
for (i = 0; i < yourImages.length-1; i++) {
preloadBar += '<img src="' + dots[0].src + '" width="' + coverage +
'" height="' + heightOfPreloadBar + '" name="img' + i + '"
align="absmiddle">'
}
preloadBar += '<img src="' + dots[0].src + '" width="' +
(leftOverWidth+coverage) + '" height="' + heightOfPreloadBar + '"
name="img' + (yourImages.length-1) + '" align="absmiddle">'
document.write(preloadBar)
loadImages()
}
document.getElementById("preload_area").innerHTML = "Done";
// end hiding -->
</script>
</center>
</body>
</html>
If you want to run the code, you need to have images. you can get the
bar.zip file from http://www.dynamicdrive.com/dynamicindex4/preloadimage.htm
thanks