CODEWITHSUNDEEP
javascriptjquery
bswinnerton
bswinnerton

Reputation: 4721

Move to bottom of page after fadeIn

I'm looping through each element that has a class of .fadeIn, and then what I would like to do is move to the bottom of the page (since this goes top down). It should always be at the bottom of the page.

The following code doesn't work:

jQuery( document ).ready(function ($) {
    var delay = 900
    $( ".fadein" ).hide();
    $( ".fadein" ).each(function (index) {
      $( this ).delay( index * delay ).fadeIn( "slow" );
      $( "html, body" ).scrollTop( $( document ).height() );
    });
});

Upvotes: 0

Views: 55

Answers (1)

sidonaldson
sidonaldson

Reputation: 25284

I suspect what you want is the page to automatically scroll to each item as it fades in.

Try changing it to:

 $( ".fadein" ).each(function (index) {
    $(this).delay( index * delay ).fadeIn( "slow" );
    $( "html, body" ).scrollTop( $(this).offset().top );
})

$(this).offset().top - will return the position of the element from the top of the page.

Upvotes: 1

Related Questions