SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Enthusiast
    Join Date
    Aug 2002
    Location
    Australia
    Posts
    56
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Image preloading not working in IE?

    I have a simple image preload script:
    Code:
    var imgArr = ['i1.gif', 'i2.gif', 'i3.gif'];
    var img;
    for (var i=0, l=imgArr.length ; i<l ; i++) {
        img = new Image();
        img.src = imgArr[i];
    }
    It seems to work fine, but not in IE6/Win. I go to check the Temporary Internet Files folder, and the images don't seem to be preloading.

    But if I add an alert statement after img.src=..., then they do preload!

    Is there anything wrong in the code?

  2. #2
    SitePoint Addict SwordsmanX's Avatar
    Join Date
    Sep 2005
    Posts
    211
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Image preloading should not be done with javascript, you're much better off using css and loading a non-existant #id with a background-image you want to preload

  3. #3
    SitePoint Enthusiast
    Join Date
    Aug 2002
    Location
    Australia
    Posts
    56
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Kendothpro View Post
    Image preloading should not be done with javascript, you're much better off using css and loading a non-existant #id with a background-image you want to preload
    That depends on the situation. In this case, the images will only be used by JS-enabled browsers, so using JS is the best option, imo.

    In addition, the preloaded image list is generated via PHP, so using CSS would be a bit complicated. Of course I could generate a <style> block dynamically... Anyway, JS this time.

    I agree that for rollovers and similar things CSS-preloading is generally a better solution.

  4. #4
    SitePoint Addict SwordsmanX's Avatar
    Join Date
    Sep 2005
    Posts
    211
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wel then maybe you have to actually insert the img node into the DOM and not just create it? Might be wrong tho :/

  5. #5
    SitePoint Enthusiast
    Join Date
    Aug 2002
    Location
    Australia
    Posts
    56
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Kendothpro View Post
    Wel then maybe you have to actually insert the img node into the DOM and not just create it? Might be wrong tho :/
    Thanks Kendothpro. Maybe, but as far as I know this is all is needed. I think the code basically is correct (adding the alert makes it work fine in IE, and in FF it works fine from the beginning). I was hoping someone has experienced the same situation and knows what's going on.

    Maybe the problem is only when running it in my local machine, and it would work fine once uploaded.

    If anyone has any tips or ideas about this, they'll be more than welcome.

  6. #6
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code looks good. Though you are re-assigning each image to the img variable. How will you later access these preloaded images?

  7. #7
    SitePoint Enthusiast
    Join Date
    Aug 2002
    Location
    Australia
    Posts
    56
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Pepejeria View Post
    Code looks good. Though you are re-assigning each image to the img variable. How will you later access these preloaded images?
    All I need is their src attribute, which is already in imgArr. I tried to store them in an array to see if that influenced the preloading in IE but it made no difference.

    Maybe it is preloading them, and it just seems to not be doing it in my local machine, for some other reason... Oh well, I think I'll forget about this, if worse comes to worse, IE users will have to wait a bit longer. I'll just add a 'get firefox button' somewhere near.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •