Help with progess bar

**Lover of JS** · 05-07-2007, 11:30 PM

Script:Preload Image (with progress bar) Script
http://www.dynamicdrive.com/dynamici...eloadimage.htm

I am having trouble with the preloading image script on Dynamic Drive, I followed the instructions, but when i visit the page with the script on it, it starts to load, but never completes, I am using IE7. If you could please look over the source code, and tell me where i went wrong, i would much appreciate it.

Code:

<html>
<head>
<title>Preload Image Page</title>
<script language="JavaScript1.1">
<!-- begin hiding
/*
Preload Image With Update Bar Script (By Marcin Wojtowicz [one_spook@hotmail.com])
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.autohotkey.net/~crusader/CrusaderClanHome.htm"
 var lengthOfPreloadBar = 200 // Length of preload bar (in pixels)
 var heightOfPreloadBar = 20 // 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://img340.imageshack.us/img340/2365/titlegs7.png","http://img522.imageshack.us/img522/8814/homelv3.png","http://img144.
imageshack.us/img144/5677/forumdg6.png","http://img223.imageshack.us/img223/6645/ournexteventky9.png","http://img223.imagesha
ck.us/img223/1567/clanactivitiesly9.png","http://img223.imageshack.us/img223/1285/rulesrequirementszv7.png","http://img157.im
ageshack.us/img157/6650/ourmembersir5.png","http://img157.imageshack.us/img157/6518/clanapplicationswi8.png","http://img223.i
mageshack.us/img223/8706/screenshotsoi8.png","http://img179.imageshack.us/img179/3745/homemaintextrz1.png","http://img122.ima
geshack.us/img122/6184/maintextox4.png","http://img157.imageshack.us/img157/194/maintextbottomuf5.png","http://img150.imagesh
ack.us/img150/5368/cmotmwb6.png","http://img150.imageshack.us/img150/8183/textsmki8.png","http://img510.imageshack.us/img510/
1690/smhummerzj7.png","","http://img522.imageshack.us/img522/1448/greybottomgu3.png","http://img299.imageshack.us/img299/1897
/affiliatessw5.png","http://img143.imageshack.us/img143/3487/copyrightfc6.png")
// 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&#37;coverage
}
function loadImages() { 
 for (i = 0; i < yourImages.length; i++) { 
  preImages[i] = new Image()
  preImages[i].src = yourImages[i]
 }
 for (i = 0; i < preImages.length; i++) { 
  loaded[i] = false
 }
 checkLoad()
}
function checkLoad() {
 if (currCount == preImages.length) { 
  location.replace(locationAfterPreload)
  return
 }
 for (i = 0; i <= preImages.length; i++) {
  if (loaded[i] == false && preImages[i].complete) {
   loaded[i] = 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">Please be patient while some images<br>
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.write('<p><small><a href="javascript:window.location=locationAfterPreload">Skip Preloading</a> &nbsp;| &nbsp;<a 
href="http://dynamicdrive.com/">Script Credits</a></small></p>')
// end hiding -->
</script>
</center>
</body>
</html>

**ddadmin** · 05-07-2007, 11:32 PM

Warning: Please include a link to the DD script in question in your post. See this thread for the proper posting format when asking a question.

**Lover of JS** · 05-08-2007, 11:18 PM

Here is the adress of the script in action, http://www.autohotkey.net/~crusader/Preload.htm

Thread: Help with progess bar

Thread Tools

Search Thread

Help with progess bar

Bookmarks

Bookmarks

Posting Permissions