如何向下滚动像向上滚动一样，在向下滚动中我没有页面高度

Question

I'm unable to scroll down at the bottom...

At there above code is working fine for top but for bottom we don't know the height of page.Then it's creating problem for going end of the page. please suggest me...Thanks

$('.scrollToDown').fadeIn();
$(window).scroll(function(){
    if ($(this).scrollTop() > 0) {
        $('.scrollToTop').fadeIn();
        $('.scrollToDown').fadeOut();
    } else {
        $('.scrollToTop').fadeOut();
        $('.scrollToDown').fadeIn();
    }
});
$('.scrollToTop').click(function(){
    $('html, body').animate({scrollTop : 0},700);
    return false;
});
$('.scrollToDown').click(function(){
    $('html, body').animate({scrollTop : 5110},1000);
    return false;
});

Answer 1

You can use $(document).height()

try this

$('.scrollToDown').fadeIn();
$(window).scroll(function(){
    if ($(this).scrollTop() > 0) {
        $('.scrollToTop').fadeIn();
        $('.scrollToDown').fadeOut();
    } else {
        $('.scrollToTop').fadeOut();
        $('.scrollToDown').fadeIn();
    }
});
$('.scrollToTop').click(function(){
    $('html, body').animate({scrollTop : 0},700);
    return false;
});
$('.scrollToDown').click(function(){
    $('html, body').animate({scrollTop : $(document).height()},1000);
    return false;
});

Answer 2

You can just animate to scroll down the page by animating the scrollTop property, no plugin required, like this:

$(window).load(function() {
  $("html, body").animate({ scrollTop: $(document).height() }, 1000);
});

Note the use of window.onload (when images are loaded...which occupy height) rather than document.ready.

To be technically correct, you need to subtract the window's height, but the above works:

$("html, body").animate({ scrollTop: $(document).height()-$(window).height() });

To scroll to a particular ID, use its .scrollTop(), like this:

$("html, body").animate({ scrollTop: $("#myID").scrollTop() }, 1000);

Answer 3

The value that you should scroll to is the height of the page minus the height of the window:

$('.scrollToDown').click(function(){
    var h = $(document).height() - $(window).height();
    if (h > 0) {
        $('html, body').animate({scrollTop : h},1000);
    }
    return false;
});

Demo: http://jsfiddle.net/Guffa/cnfn8ayr/