jquery 滚动到指定ID位置

最新推荐文章于 2024-06-14 10:34:52 发布

唯-心

最新推荐文章于 2024-06-14 10:34:52 发布

阅读量5.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript

本文链接：https://blog.youkuaiyun.com/u011598153/article/details/25717815

javascript 专栏收录该内容

5 篇文章

订阅专栏

本文展示了如何使用jQuery将HTML元素的scrollTop属性设置为指定值，并通过offset方法获取元素的位置。通过简单的按钮交互，实现对页面元素滚动和位置信息的动态控制。

<html>
<head>
</head>
<body>
<div style="border:1px solid black;width:200px;height:200px;overflow:auto">
This is some text1. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text2. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text3. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text4. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text5. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text6. This is some text. This is some text. This is some text. This is some text. This is some text.
</div>
<button class="btn1">把 scroll top offset 设置为 100px</button>
<br />
<button class="btn2">获得 scroll top offset</button>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$( ".btn1" ).click(function(){
$( "div" ).animate( {scrollTop : 100 },1000 );
});
$( ".btn2" ).click(function(){
alert( $( "div" ).offset().top+"px" );
});
});
</script>
</body>
</html>