沒圖我說個(gè)錘子，先來個(gè)自拍鎮(zhèn)樓。

又到了每周周五總結(jié)時(shí)間。我廣州劉德華又來講故事了。這一周沒啥任務(wù)，就一個(gè)任務(wù)，產(chǎn)品口頭交代了兩句，也沒有psd沒有設(shè)計(jì)圖沒有樣式。自由發(fā)揮，你自己敲代碼做個(gè)作品出來。

what？聽到這個(gè)的時(shí)候我是一臉懵逼。我心里很慌，難道我資深射雞濕和靈魂畫家的身份暴露了？心里不禁感嘆，唉，是金子哪里都會發(fā)光。

扯太遠(yuǎn)了，先來總結(jié)一下今天要寫的東西吧。jquery的scrollTop方法，這是啥子，那就先來一波自我介紹

1、scrollTop() 方法返回或設(shè)置匹配元素的滾動條的垂直位置。

2、scroll top offset 指的是滾動條相對于其頂部的偏移。

如果該方法未設(shè)置參數(shù)，則返回以像素計(jì)的相對滾動條頂部的偏移。直接上例子吧

$(document).ready(function(){
　　$("button1").click(function(){
　　　　$("body").scrollTop(100);
　　});
});

這個(gè)東西其實(shí)很常見，比如在瀏覽頁面時(shí)，頁面有5大塊。那么你想直接從第一塊跳轉(zhuǎn)到第5塊瀏覽，那么這個(gè)東西就可以用了，在scrollTop方法中設(shè)置一個(gè)參數(shù)，也就是選中元素距離頁面頂部的距離。

上面的代碼，當(dāng)我們點(diǎn)擊button1時(shí)，頁面會往下移動100px；那換成div呢，其實(shí)是一樣的。就是滾動條往下走100px。

還有就是在網(wǎng)頁中有很多返回頂部按鈕，通過這個(gè)方法也可以實(shí)現(xiàn)

$('body,html').animate({scrollTop:0},500)，這里結(jié)合了animate（）方法，另一種則是$(window).scrollTop（0）

更多專業(yè)前端知識，請上 【猿2048】www.mk2048.com 創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的关于使用JQ scrollTop方法进行滚动定位的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。