那想问返回底部用哪个方法？我以为可以用scrollBottom呢？

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>2-5、定位回到顶部</title>
    <style type="text/css">
    * {
        margin: 0;
        padding: 0;
    }
    html,body {
        width: 100%;
        height: 100%;
        font-size: 14px;
    }
    header {
        height: 35px;
        background: #666;
    }
    header a {
        line-height: 35px;
        color: #fff;
        text-decoration: none;
        margin: 0 15px;
    }
    .container {
        height: 200%;
    }
    .backtop{
        width:50px;
        height:50px;
        text-align:center;
        padding-top: 13px;
        background:grey;
        color: white;
        position: fixed;
        right:0;
        bottom:0;
    }
    .backbottom{
        width:50px;
        height:50px;
        text-align:center;
        padding-top: 13px;
        background:grey;
        color: white;
        position: fixed;
        top:0;
        right:0;
    }
    </style>
</head>
<body>
    <div class='backbottom'>
        <span>返回<br/>底部</span>
    </div>
    <header>
        <a href="">首页</a>
        <a href="">新课程</a>
        <a href="">热门课程</a>
    </header>
    <div class="container"></div>
    <div class='backtop'>
        <span>返回<br/>顶部</span>
    </div>
 <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>
 <script >
     $(function(){
        $('.backtop').on('click',function(event){
           $('html,body').scrollTop(0);
        });

        $('.backbottom').click(function(){
            $('html,body').scrollBottom(0);
        })
     })
 </script>
</html>

精慕门0318346 2018-07-24

源自：jQuery弹出层案例 2-4 编程练习

收起

3回答

离离钟 2018-07-25 16:12:45

 $('.backbottom').click(function(){
            $('body').scrollTop($(document).height());
        })

这样就行，$(document).height()代表文档的总高度。scrollTop()的参数就是一个高度的值，只要填上最高的高度，也就是$(document).height()，就会到最底部了。一起加油！

收起回答

提问者精慕门0318346 #1

你这个不行，滚条不会动，还是要像下面两位写的那样，需要减法

2018-07-26 11:41:28
离离钟回复提问者精慕门0318346 #2

我发现我这个方法再谷歌浏览器和Microsoft Edge可以用，再火狐上不能用。我去问问老师。

2018-07-26 15:34:24

JOYING1995 2018-07-24 14:13:23

$(document).scrollTop+$(window).height()=$(document).height();

所以要到底部应该是：$(document).height()-$(window).height()；

收起回答

好帮手慕星星 2018-07-24 12:00:17

参考：

可以使用scrollTop来完成哦。自己测试下，祝学习愉快~~

收起回答

离离钟 #1

$('.backbottom').click(function(){ $('body').scrollTop($(document).height()); }); 老师我用这个方法再谷歌浏览器和Microsoft Edge可以用，在火狐上不能用。是什么原因？我有用到的东西有什么兼容性的问题吗？

2018-07-26 15:36:47
离离钟 #2

是基于这个帖子同学提问的基础上。。

2018-07-26 15:37:26
好帮手慕星星回复离离钟 #3

每个浏览器的兼容性不同，你可以这样写： $('html,body').scrollTop($(document).height()); html和body一起写就可以了。

2018-07-26 15:53:13