jquery div内容滚动到指定的ID位置.

最新推荐文章于 2023-06-27 10:26:29 发布

hljqfl

最新推荐文章于 2023-06-27 10:26:29 发布

阅读量2.7k

点赞数

分类专栏： JS-CSS

本文链接：https://blog.csdn.net/hljqfl/article/details/85677516

版权

JS-CSS 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $(".btn1").click(function(){
    //alert($("#div").scrollTop()+" px");
    alert($("#d2").offset().top+$("#div").scrollTop()+" px");
    //alert($("#d2").offset().top - $("#div").offset().top + $("#div").scrollTop()+" px");
    $("#div").scrollTop($("#d2").offset().top - $("#div").offset().top + $("#div").scrollTop() );
  });
});
</script>
</head>
<body>
<div style="height:60px;">xxx</div>
<div id="div" style="border:1px solid black;width:200px;height:200px;overflow:auto">
This is some text.<br><div id="d1">1</div> This is some text. This is some text. This is some text. This is some text. This is some text.<div id="d2">2</div> This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.<br><div id="d3">3</div>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. <div id="d4">4</div>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. <br><div id="d5">5</div>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.
</div>
<button class="btn1">获得 scrollbar top offset</button>
<p>试着移动滚动条，然后再次点击按钮。</p>
</body>
</html>