jQuery中获取scroll滚动的距离


<html>

<head>
<title></title>
</head>
    <style>
        *{
            margin:0;
            padding:0;
        }
        .father{
            width:100px;
            height:100px;
            overflow:auto;
        }
        
    </style>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
        
        $(function(){
            
            console.log($('.father').scrollTop())      //获取div的滚动距离
            $('.father').scrollTop(100)                //设置滚动条滚动的距离
            console.log($('body').scrollTop()+$('html').scrollTop())  //获取浏览器滚动条滚动的距离,考虑到了浏览器兼容性
            $('body,html').scrollTop(100)                     //设置浏览器滚动条滚动的距离,考虑到兼容性问题,必须这样写
        })
        
    </script>
    
<body>
    <div class="father"> 
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div我是div我是div我是div我是div我是div我是div我是div
        我是div
    </div>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
</body>
</html>

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM