Clever Geek Handbook

JavaScript and IE7 - Why is my * .onload = function () {} not firing?

I have a gallery that I quickly coded for a small site and works great under Firefox 3 and Safari 3. But when I test my old IE7 best friend it doesn't seem to run imageVar.onload = function () {// code here} I want to use to stop the loading effect and load the image.

Please keep in mind...

  • I know that thumbnails are just scaled-down versions of large images. Once the images are completed by the client, I'm going to create the corresponding thumbnails.
  • This is my first attempt at trying to break out of procedural JavaScript for the most part. So please go easy and kindly let me know where my code is sucking!
+1


source to share


3 answers


To use Image.onload successfully, you must register an event handler method before the src attribute is set.

More information in this question:



Javascript callback for loading images

+5


source


Cross-browser support is not easy due to implementation differences. Since you are using jQuery on your site, you are better off using your event methods to normalize browser support:

instead:

 window.load = function(){ 
      //actions to be performed on window load
 }

 imageViewer.image.onload = function(){ 
     //actions to be performed on image load
 }


do:

$(window).load(function(){ 
    //actions to be performed on window load
});

 $(imageViewer.image).load(function(){ 
      //actions to be performed on image load
 });
+2


source


To add to Eran's suggestion to use jQuery's built in event handlers, you can run the code on document load and DOM creation, but before images are loaded with:

$(document).ready(function(){
   //your code
});
0


source






More articles:


All Articles