1、當前滾動的地方的窗口頂端到整個頁面頂端的距離:
var winPos = $(window).scrollTop();
2、獲取指定元素的頁面位置:
$(val).offset().top;
3、對頁面滾動條滾動的監聽:要放在頁面加載的時候
$(window).scroll(function(event){
});
4、設置滾動條到指定位置。$(window).scrollTop(offset)。
以下內容轉載自http://www.jb51.net/article/59965.htm
本文實例講述了jQuery中scrollTop()方法用法。分享給大家供大家參考。具體分析如下:
語法結構一:
當scrollTop()方法不帶有參數的時候是返回匹配元素相對滾動條頂部的偏移量。
$(selector).scrollTop()
實例代碼:
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style type="text/css"> #div1{ border:1px solid black; width:200px; height:200px; overflow:auto } #div2{height:250px;} #div3{ height:48px; width:30px; border:1px solid red; } </style> </head> <body> <div id="div1"> <div id="div2"> <div id="div3"></div> </div> </div> <button>獲得offset值</button> <script src="dist/js/jquery-1.11.3.js"></script> <script> $(document).ready(function(){ $("button").click(function(){ alert($("#div1").scrollTop()+" px"); }); }); </script> </body> </html>
語法結構二:
當scrollTop()方法帶有參數的時候置垂直滾動條頂部偏移為該值。
$(selector).scrollTop(val)
參數列表:
參數 | 描述 |
val | 設定垂直滾動條值 |
$(document).ready(function(){ $("button").click(function(){ $("#div1").scrollTop(30); }) })
實現的效果為點擊按鈕后,垂直滾動條自動滾動到其頂部距離窗口上端的30px的位置。