jQuery scrollTop() 方法

定义和用法

scrollTop() 方法设置或返回被选元素的垂直滚动条位置。

提示：当滚动条位于最顶部时，位置是 0。

当用于返回位置时：该方法返回第一个匹配元素的滚动条的垂直位置。

当用于设置位置时：该方法设置所有匹配元素的滚动条的垂直位置。

语法

返回垂直滚动条位置：

$(selector).scrollTop()

设置垂直滚动条位置：

$(selector).scrollTop(position)

参数描述

参数	描述
position	规定以像素为单位的垂直滚动条位置。

实例

下例演示了返回 <div> 元素的垂直滚动条位置：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>欢迎来到蝴蝶教程</title>
//此版本是百度cdn 1.11.1，当然你可以使用更高的版本，从2.0版本以上的是不支持ie6-8的
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script>
    $(document).ready(function () {
       $("button").click(function(){
          alert($("div").scrollTop()+" px");
       });
    });
</script>
</head>
<body>
    <div style="border:1px solid black;width:150px;height:100px;overflow:auto">
      欢迎来到蝴蝶教程欢迎来到蝴蝶教程欢迎来到蝴蝶教程欢迎来到蝴蝶教程这是一个段这是一个
      段这是一个段落这欢迎来到蝴蝶教程欢迎来到蝴蝶教程欢迎来到蝴蝶教程欢迎来到蝴蝶教程是一个段落。
    </div>
    <button>返回垂直滚动条的位置</button>
    <p>向下移动滚动条,再次单击该按钮。</p>
</body>
</html>

尝试一下

jQuery scrollTop() 方法

定义和用法

语法

参数描述

实例

相关页面