CODEWITHSUNDEEP
jqueryloadthis
Andre Gagnon
Andre Gagnon

Reputation: 56

Fade in Multiple Divs When Each is Loaded

I'm trying to have multiple divs fade in when the content of each is done loading. Can't seem to get it to work. 

   $(function() {
    $(".postphoto").bind("load", function () { $(this).fadeIn(); });
   });

There are multiple divs with the same class, and I need to fade each in when they are ready. Any ideas of where I'm going wrong?

Thanks ahead of time!

Upvotes: 2

Views: 232

Answers (2)

Craig
Craig

Reputation: 972

You could look at using the imagesLoaded plugin to check if each image has loaded and then fade it in when successful.

The plugin also has the benefit of allowing for cached images.

Upvotes: 1

aziz punjani
aziz punjani

Reputation: 25786

From jQuery docs. Emphasis, mine.

The load event is sent to an element when it and all sub-elements have been completely loaded. This event can be sent to any element associated with a URL: images, scripts, frames, iframes, and the window object.

So unless it's one of those elements described above, there's not a good way to tell when data for a specific div has loaded, the document.ready fires when the DOM has finished loading, excluding images.

Upvotes: 0

Related Questions