jQuery滚动到页面底部 [英] jQuery scroll to bottom of page

查看:143
本文介绍了jQuery滚动到页面底部的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

当您单击某个链接时,我使用以下内容滚动到页面顶部.

Im using the following to scroll to the top of a page when you click a certain link.

$('.myLinkToTop').click(function () {
    $('html, body').animate({scrollTop:0}, 'slow');
    return false;
});

我想创建另一个滚动到页面底部的链接.以下工作正常.我认为它会尝试将页面向下滚动1000像素,因此,如果页面较短,则滚动速度会比其应有的要快;如果页面较高,则它将不会一直滚动至底部.如何用窗口高度替换"1000"?谢谢

I want to make another link that scrolls to the bottom of the page. The following is working OK. I think it tries to scroll 1000px down the page, so if the page is shorter then it scrolls faster than it should, and if the page is taller then it wont go all the way to the bottom. How can I replace '1000' with the window height? Thanks

$('.myMenuLink').click(function () {
    $('html, body').animate({scrollTop:1000}, 'slow');
    return false;
});

我知道这段代码跳到了页面的底部,但是确实可以平滑滚动,就像我需要的那样:

I know that this code jumps to the bottom of the page, but it doenst scroll smoothly like I need:

$(document).scrollTop($(document).height());

推荐答案

您的动画和移动到文档底部的要求可以通过下面的代码实现

Your requirement to animate and move to bottom of document can be achieved by the code below

HTML

<html>
<head>
</head>
<body>
    <div style="height:1500px">
        <button class="myLinkToTop" id="but1" >1</button>
    </div>
        <button class="myMenuLink" id="but1" >2</button>
</body>
</html>

JS

$('.myLinkToTop').click(function () {
    $('html, body').animate({
        scrollTop: $(document).height()
    }, 'slow');
    return false;
});

$('.myMenuLink').click(function () {
    $('html, body').animate({
        scrollTop:0
    }, 'slow');
    return false;
});

请参阅此链接

http://jsfiddle.net/q6Wsp/6/

这篇关于jQuery滚动到页面底部的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆