logo-dw

Go Back   Dreamweaver Club Forums > Graphic Design > Web Design
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 02-01-2010, 12:26 AM   #1
jbarnes
 
Join Date: Feb 2010
Posts: 4
Unhappy HTML Javascript Preloader

Hey all,

I am creating a modified Javascript preloader to enhance the speed of my HTML site...

The preloader loads fine on safari/firefox; however, on the deathstar browser (IE) it loads to about 97% then stalls and times out.

Can anyone look at the coding and suggest a route of fixing the problem, or perhaps lead me to a link that will help...

Thanks in advance! and I totally understand if the Mods want to move this to another location.

Site: www.rockspire.com

Code:

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 = "index2.html" // URL of the page after preload finishes
    var lengthOfPreloadBar = 450 // Length of preload bar (in pixels)
    var heightOfPreloadBar = 10 // 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://rockspire.com/images/lparch1.jpg",
                               "http://rockspire.com/images/lparch2.jpg",
                               "http://rockspire.com/images/lparch3.jpg",
"http://rockspire.com/images/lparch4.jpg",
"http://rockspire.com/images/lparch5.jpg",
"http://rockspire.com/images/lparch6.jpg",
"http://rockspire.com/images/lparch7.jpg",
"http://rockspire.com/images/lparch8.jpg",
"http://rockspire.com/images/lparch9.jpg",
"http://rockspire.com/images/lpart1.jpg",
"http://rockspire.com/images/lpart2.jpg",
"http://rockspire.com/images/lpart3.jpg",
"http://rockspire.com/images/lpart4.jpg",
"http://rockspire.com/images/lpart5.jpg",
"http://rockspire.com/images/lpart6.jpg",
"http://rockspire.com/images/lpart7.jpg",
"http://rockspire.com/images/lpbetty1.jpg",
"http://rockspire.com/images/lpbetty2.jpg",
"http://rockspire.com/images/lpbetty3.jpg",
"http://rockspire.com/images/lpbetty4.jpg",
"http://rockspire.com/images/lpbetty5.jpg",
"http://rockspire.com/images/lpnature1.jpg",
"http://rockspire.com/images/lpnature2.jpg",
"http://rockspire.com/images/lpnature3.jpg",
"http://rockspire.com/images/lpnature4.jpg",
"http://rockspire.com/images/lpnature5.jpg",
"http://rockspire.com/images/lpnature6.jpg",
"http://rockspire.com/images/lpnature7.jpg",
"http://rockspire.com/images/lpnature8.jpg",
"http://rockspire.com/images/lpnature9.jpg",
"http://rockspire.com/images/lpnature10.jpg",
"http://rockspire.com/images/lpnature11.jpg",
"http://rockspire.com/images/thumbnail_arch1.jpg",
"http://rockspire.com/images/thumbnail_arch1bw.jpg",
"http://rockspire.com/images/thumbnail_arch10.jpg",
"http://rockspire.com/images/thumbnail_arch10bw.jpg",
"http://rockspire.com/images/thumbnail_arch11.jpg",
"http://rockspire.com/images/thumbnail_arch11bw.jpg",
"http://rockspire.com/images/thumbnail_arch2.jpg",
"http://rockspire.com/images/thumbnail_arch2bw.jpg",
"http://rockspire.com/images/thumbnail_arch3.jpg",
"http://rockspire.com/images/thumbnail_arch3bw.jpg",
"http://rockspire.com/images/thumbnail_arch4.jpg",
"http://rockspire.com/images/thumbnail_arch4bw.jpg",
"http://rockspire.com/images/thumbnail_arch5.jpg",
"http://rockspire.com/images/thumbnail_arch5bw.jpg",
"http://rockspire.com/images/thumbnail_arch6.jpg",
"http://rockspire.com/images/thumbnail_arch6bw.jpg",
"http://rockspire.com/images/thumbnail_arch7.jpg",
"http://rockspire.com/images/thumbnail_arch7bw.jpg",
"http://rockspire.com/images/thumbnail_arch8.jpg",
"http://rockspire.com/images/thumbnail_arch8bw.jpg",
"http://rockspire.com/images/thumbnail_arch9.jpg",
"http://rockspire.com/images/thumbnail_arch9bw.jpg",
"http://rockspire.com/images/thumbnail_art1.jpg",
"http://rockspire.com/images/thumbnail_art1bw.jpg",
"http://rockspire.com/images/thumbnail_art2.jpg",
"http://rockspire.com/images/thumbnail_art2bw.jpg",
"http://rockspire.com/images/thumbnail_art3.jpg",
"http://rockspire.com/images/thumbnail_art3bw.jpg",
"http://rockspire.com/images/thumbnail_art4.jpg",
"http://rockspire.com/images/thumbnail_art4bw.jpg",
"http://rockspire.com/images/thumbnail_art5.jpg",
"http://rockspire.com/images/thumbnail_art5bw.jpg",
"http://rockspire.com/images/thumbnail_art6.jpg",
"http://rockspire.com/images/thumbnail_art6bw.jpg",
"http://rockspire.com/images/thumbnail_art7.jpg",
"http://rockspire.com/images/thumbnail_art7bw.jpg",
"http://rockspire.com/images/thumbnail_b1.jpg",
"http://rockspire.com/images/thumbnail_b1bw.jpg",
"http://rockspire.com/images/thumbnail_b2.jpg",
"http://rockspire.com/images/thumbnail_b2bw.jpg",
"http://rockspire.com/images/thumbnail_b3.jpg",
"http://rockspire.com/images/thumbnail_b3bw.jpg",
"http://rockspire.com/images/thumbnail_b4.jpg",
"http://rockspire.com/images/thumbnail_b4bw.jpg",
"http://rockspire.com/images/thumbnail_b5.jpg",
"http://rockspire.com/images/thumbnail_b5bw.jpg",
"http://rockspire.com/images/thumbnail_nat1.jpg",
"http://rockspire.com/images/thumbnail_nat1bw.jpg",
"http://rockspire.com/images/thumbnail_nat2.jpg",
"http://rockspire.com/images/thumbnail_nat2bw.jpg",
"http://rockspire.com/images/thumbnail_nat3.jpg",
"http://rockspire.com/images/thumbnail_nat3bw.jpg",
"http://rockspire.com/images/thumbnail_nat4.jpg",
"http://rockspire.com/images/thumbnail_nat4bw.jpg",
"http://rockspire.com/images/thumbnail_nat5.jpg",
"http://rockspire.com/images/thumbnail_nat5bw.jpg",
"http://rockspire.com/images/thumbnail_nat6.jpg",
"http://rockspire.com/images/thumbnail_nat6bw.jpg",
"http://rockspire.com/images/thumbnail_nat7.jpg",
"http://rockspire.com/images/thumbnail_nat7bw.jpg",
"http://rockspire.com/images/thumbnail_nat8.jpg",
"http://rockspire.com/images/thumbnail_nat8bw.jpg",
"http://rockspire.com/images/thumbnail_nat9.jpg",
"http://rockspire.com/images/thumbnail_nat9bw.jpg",
"http://rockspire.com/images/thumbnail_nat10.jpg",
"http://rockspire.com/images/thumbnail_nat10bw.jpg",
"http://rockspire.com/images/thumbnail_nat11.jpg",
"http://rockspire.com/images/thumbnail_nat11bw.jpg",
"http://rockspire.com/images/index_01.jpg",
"http://rockspire.com/images/index_02.jpg",
"http://rockspire.com/images/index_04.jpg",
"http://rockspire.com/images/index_05.jpg",
"http://rockspire.com/images/index_06.jpg",
"http://rockspire.com/images/index_13.jpg",
"http://rockspire.com/images/index_14.jpg",
"http://rockspire.com/images/nature_pic_area.jpg",
"http://rockspire.com/images/art_pic_area.jpg",
"http://rockspire.com/images/arch_01.jpg",
"http://rockspire.com/images/arch_02.jpg",
"http://rockspire.com/images/arch_04.jpg",
"http://rockspire.com/images/arch_06.jpg",
"http://rockspire.com/images/arch_07.jpg",
"http://rockspire.com/images/arch_11.jpg",
"http://rockspire.com/images/arch_12.jpg",
"http://rockspire.com/images/arch_13.jpg",
"http://rockspire.com/images/arch_20.jpg",
"http://rockspire.com/images/arch_21.jpg",
"http://rockspire.com/images/overview.pdf",
"http://rockspire.com/images/Rockspire_Site_Map.pdf",
"http://rockspire.com/images/main_concept_image.jpg",
"http://rockspire.com/images/main_contact_image.jpg",
"http://rockspire.com/images/contact_main_pic.jpg",
"http://rockspire.com/images/main_events_image.jpg",
"http://rockspire.com/images/main_inspiration_image.jpg",
"http://rockspire.com/images/main_manifesto_image.jpg",
"http://rockspire.com/images/main_photos_image.jpg",
"http://rockspire.com/images/main_resources_image.jpg"
                               )

// Do not modify anything beyond this point!
if (document.images) {
    var dots = new Array() 
    dots[0] = new Image(1,1)
    dots[0].src = "images/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 = "images/red.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[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>

<style type="text/css">
<!--
body p {
    font-family: "Helvetica Neue";
}
.preload_body_rule {
    font-family: "Helvetica Neue";
    font-size: 12px;
    color: #666;
    padding-top: 30px;
}
.Welcome_rule {
    font-family: "Helvetica Neue";
    font-size: 18px;
    color: #333;
}
a {
    font-family: Helvetica Neue;
    font-size: 12px;
    color: #666;
}
a:link {
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #666;
}
a:hover {
    text-decoration: none;
    color: #CCC;
}
a:active {
    text-decoration: none;
    color: #666;
}
.er {
    font-style: italic;
    font-family: "Helvetica Neue";
    font-size: 12px;
    color: #666;
}
-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></head>

<body bgcolor="#FFFFFF">

<center>
<p><font size="4" class="preload_body_rule"><span class="Welcome_rule"><br>
  <br><br><br><br>WELCOME TO ROCKSPIRE...</span><br>
  </font><span class="er"><font size="4" class="er">A new concept in future living</font></span><font size="4" class="preload_body_rule"><br>
  <br>
  </font><font size="4" class="preload_body_rule"><br>
  Please wait while website preloads...</font></p>
<p>
  <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>  |  <a href="http://dynamicdrive.com/">Script Credits</a></small></p>')
// end hiding -->
</script>
  
</center></body>
</html>

Last edited by Corrosive; 02-01-2010 at 07:02 AM..
jbarnes is offline   Reply With Quote
Old 02-01-2010, 07:04 AM   #2
Corrosive
Corrosive's Avatar
 
Join Date: Feb 2008
Location: Bristol, England
Posts: 7,103
Default

Quote:
Originally Posted by jbarnes View Post
I am creating a modified Javascript preloader to enhance the speed of my HTML site...
Come again?
Corrosive is offline   Reply With Quote
Old 02-01-2010, 07:15 AM   #3
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,175
Default

the preloader takes forever, how big are those images?
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 02-01-2010, 08:34 AM   #4
Corrosive
Corrosive's Avatar
 
Join Date: Feb 2008
Location: Bristol, England
Posts: 7,103
Default

I guess what we are trying to say is 'why are you masking the problem with a preloader when sorting out your build problems needs to be your priority?' You are currently doing what is known as 'papering over the cracks'.

I reckon you have done nearly all of these; http://corrosiveonline.co.uk/article...r_mistakes.php
Corrosive is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 03:33 AM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com