Question

I have a small script on jQuery 1.7.2. Essentially, it displays the thumbnail, and then is replaced with the full image once that has loaded.

<img src="http://site.com/thumbnail.jpg" data-original="http://site.com/original.jpg"  class="preload">

Within jQuery, I simply have:

$('.preload').load(function(){

     $(this).attr('src', $(this).attr("data-original"));

});

Which works fine on browsers such as Firefox, Chrome, and even IE8. However, IE7 will continue to throw a

Stack overflow at line: 0

Error (multiplied by the number of elements that have the preload class).

If I remove the class from the images.. the error is not shown.

Thanks

Answer 1

You are executing onload event on image and then chanign the image SRC so onload will fire again. its in infinite loop so you are getting stack overflow.

  $('.preload').load(function(){
    if($(this).attr('src') != $(this).attr("alt")){
         $(this).attr('src', $(this).attr("alt"));
    }
  });