fade in all divs of a page. once the content of the divs is loaded

Question

Sorry, Ill try simplify my question. Basically, when a user goes to a page...all the divs on the page and the content of the div fade in. Once loaded. I was thinking maybe something like:

$(window).load(function(){ 
  $('#div').load(function () { 
    $(this).fadeIn(4000); 
  });
});

cheers

score 1 · Answer 1 · answered Mar 09 '10 at 07:43

1

Perhaps something like this will do what you need:

$(function() { // execute when DOM Ready:
  $("#div").load("someOtherFile.html", function() { 
    $(this).fadeIn(4000);
  }).hide();
});

answered Mar 09 '10 at 07:43

gnarf

105,192
25
127
161

I like your thinking but this maybe to complex. As im doing a shopping cart site with lots of pages. I would prefer a nice tidy script the lives in the head of every page of the site. So when any page is viewed the contents of the site fades in once loaded. . – daniel Mar 09 '10 at 07:53

score 0 · Answer 2 · answered Mar 10 '10 at 01:09

0

So you're not loading in any dynamic content, right? Have you tried, simply:

$(window).load(function(){ 
   $('#div').fadeIn(4000);
});

$(window).load shouldn't fire until the whole page is loaded anyway--you shouldn't need to test again for the div/img. Doing so might be leading to some weirdness. You want this placed outside of $(document).ready(). See: http://4loc.wordpress.com/2009/04/28/documentready-vs-windowload/

answered Mar 10 '10 at 01:09

tried your code. $(window).load(function(){ $('#div').fadeIn(4000); }); it did not work for some reason. But i had success with $(document).ready(function() { $("#panel-two").fadeIn("3000"); }); which loads in individual divs. as long as they are set to display none. So i have quite a fair bit of code in my head due to this method but it works. – daniel Mar 11 '10 at 02:14

score 0 · Answer 3 · answered Mar 16 '10 at 17:49

Perhaps this was so simple it was overlooked, but to at least clarify the first code posting for others, the line:

$('#div').fadeIn(4000); Would only work on . It may or may not work on descendante tags, depending upon their properties.

if you selected $('div').fadeIn(4000); that would perform the function on all div tags at once. And

$('.div').fadeIn(4000); Would work on all objects with a class named 'div:

Regards,

score 0 · Answer 4 · answered Mar 22 '10 at 23:16

0

James is correct, change your code to:

$(window).load(function(){ 
   $('div').fadeIn(4000);
});

using $('#div') only selects elements with an id of 'div'

answered Mar 22 '10 at 23:16

Ben

872
7
18

fade in all divs of a page. once the content of the divs is loaded

4 Answers4