jquery 仿錨點(diǎn)跳轉(zhuǎn)到頁(yè)面指定位置的實(shí)例
js 仿錨點(diǎn)跳轉(zhuǎn)到頁(yè)面指定位置,用的是 offset() 方法
$(document).ready(function(){ var target_top = $("#qa5").offset().top; //$("html,body").animate({scrollTop: target_top}, 1000); //帶滑動(dòng)效果的跳轉(zhuǎn) $("html,body").scrollTop(target_top); });
jQuery:
offset():
獲取匹配元素在當(dāng)前視口的相對(duì)偏移。
返回的對(duì)象包含兩個(gè)整型屬性:top 和 left。此方法只對(duì)可見(jiàn)元素有效。
position():
獲取匹配元素相對(duì)父元素的偏移。
返回的對(duì)象包含兩個(gè)整型屬性:top 和 left。為精確計(jì)算結(jié)果,請(qǐng)?jiān)谘a(bǔ)白、邊框和填充屬性上使用像素單位。此方法只對(duì)可見(jiàn)元素有效。
scrollTop() :
方法設(shè)置或返回被選元素的垂直滾動(dòng)條位置。
提示:當(dāng)滾動(dòng)條位于最頂部時(shí),位置是 0。
當(dāng)用于返回位置時(shí):
該方法返回第一個(gè)匹配元素的滾動(dòng)條的垂直位置。
當(dāng)用于設(shè)置位置時(shí):
該方法設(shè)置所有匹配元素的滾動(dòng)條的垂直位置。
以上這篇jquery 仿錨點(diǎn)跳轉(zhuǎn)到頁(yè)面指定位置的實(shí)例就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
jQuery滾動(dòng)監(jiān)聽(tīng)實(shí)現(xiàn)商城樓梯式導(dǎo)航效果
這篇文章主要介紹了jQuery滾動(dòng)監(jiān)聽(tīng),實(shí)現(xiàn)商城樓梯式導(dǎo)航,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-03-03jQuery實(shí)現(xiàn)單行文字間歇向上滾動(dòng)源代碼
使用jquery實(shí)現(xiàn)的文字向上滾動(dòng)效果多的不計(jì)其數(shù)吧,間歇向上滾動(dòng)卻不是那么的多,所以本文簡(jiǎn)單的實(shí)現(xiàn)了一個(gè),感興趣的朋友可以參考下哈2013-06-06jQuery實(shí)現(xiàn)監(jiān)控頁(yè)面所有ajax請(qǐng)求的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)監(jiān)控頁(yè)面所有ajax請(qǐng)求的方法,涉及jQuery中ajax請(qǐng)求的判定技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-12-12jQuery插件zTree實(shí)現(xiàn)清空選中第一個(gè)節(jié)點(diǎn)所有子節(jié)點(diǎn)的方法
這篇文章主要介紹了jQuery插件zTree實(shí)現(xiàn)清空選中第一個(gè)節(jié)點(diǎn)所有子節(jié)點(diǎn)的方法,涉及jQuery樹(shù)形插件zTree針對(duì)節(jié)點(diǎn)的遍歷與移除相關(guān)操作技巧,需要的朋友可以參考下2017-03-03jquery中的sortable排序之后的保存狀態(tài)的解決方法
其實(shí)在前年的這個(gè)時(shí)候,我就有用過(guò)這個(gè)sortable組件,那時(shí)候搞了個(gè)個(gè)人網(wǎng)站(可惜后來(lái)關(guān)了),首頁(yè)就用到了這種拖拽的效果。2010-01-01jQuery通過(guò)Ajax返回JSON數(shù)據(jù)
最近在使用JQuery的ajax方法時(shí),要求返回的數(shù)據(jù)為json數(shù)據(jù),在處理的過(guò)程中遇到下面的幾個(gè)問(wèn)題,那就是采用不同的方式來(lái)生成json數(shù)據(jù)的時(shí)候,在$.ajax方法中應(yīng)該是如何來(lái)處理的,下面依次來(lái)進(jìn)行說(shuō)明。2015-04-04jQuery實(shí)現(xiàn)類(lèi)似滑動(dòng)門(mén)切換效果的層切換
滑動(dòng)門(mén)切換效果想必大家都有見(jiàn)到過(guò)吧,在本文為大家介紹下jQuery是如何實(shí)現(xiàn)層切換的2013-09-09遮罩層點(diǎn)擊按鈕彈出并且具有拖動(dòng)和關(guān)閉效果(兩種方法)
實(shí)現(xiàn)點(diǎn)擊按鈕彈出遮罩層,點(diǎn)擊按鈕可以隨意拖動(dòng)和關(guān)閉。接下來(lái),通過(guò)本篇文章給大家介紹遮罩層點(diǎn)擊按鈕彈出并且具有拖動(dòng)和關(guān)閉效果,需要的朋友可以參考下2015-08-08