jQuery實(shí)現(xiàn)定位滾動(dòng)條位置

更新時(shí)間：2016年08月05日 11:18:27 作者：Mr.Bruce

基于jQuery實(shí)現(xiàn)滾動(dòng)條滾動(dòng)到子元素位置以此來(lái)定位滾動(dòng)條位置，下面是小編給大家?guī)?lái)的實(shí)現(xiàn)代碼，代碼比較簡(jiǎn)單，需要的朋友可以參考下

jQuery實(shí)現(xiàn)滾動(dòng)條滾動(dòng)到子元素位置（方便定位）

關(guān)鍵代碼如下所示：

<div class="of-y" id="nurse" >
　　<table class="high width" id="nurse-plan">
<tr id="tr-one"></tr>
<tr id="tr-two"></tr>
<tr id="tr-three"></tr>
<tr id="tr-four"></tr>
</table>
</div>

jQuery:

$("#nurse").scrollTop($("#nurse").scrollTop() + $('#tr-three').offset().top - $("#nurse").offset().top); --普通
$("#nurse").animate({ scrollTop: $("#nurse").scrollTop() + $('#tr-three').offset().top - $("#nurse").offset().top }, 1000); --有動(dòng)畫(huà)效果

以上所述是小編給大家介紹的jQuery實(shí)現(xiàn)定位滾動(dòng)條位置，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

jQuery實(shí)現(xiàn)動(dòng)態(tài)顯示select下拉列表數(shù)據(jù)的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)動(dòng)態(tài)顯示select下拉列表數(shù)據(jù)的方法,涉及jQuery針對(duì)json數(shù)據(jù)的讀取、遍歷及頁(yè)面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-02-02
jQuery學(xué)習(xí)筆記操作jQuery對(duì)象屬性處理
HTML文檔，不但有一系列語(yǔ)義標(biāo)簽，每個(gè)標(biāo)簽下屬還有一系列屬性節(jié)點(diǎn)。自然我們也想去操作這些屬性節(jié)點(diǎn)。格式仍然為$(selector).方法
2012-09-09
使用jQuery調(diào)用XML實(shí)現(xiàn)無(wú)刷新即時(shí)聊天
這篇文章主要介紹了使用jQuery調(diào)用XML實(shí)現(xiàn)無(wú)刷新即時(shí)聊天的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-08-08
JQ選擇器_選擇同類元素的第N個(gè)子元素的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇JQ選擇器_選擇同類元素的第N個(gè)子元素的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-09-09
淺析jQuery對(duì)select操作小結(jié)(遍歷option,操作option)
本篇文章是關(guān)于jQuery對(duì)select的操作進(jìn)行了總結(jié)介紹，需要的朋友可以參考下
2013-07-07
Ztree新增角色和編輯角色回顯問(wèn)題的解決
這篇文章主要介紹了Ztree新增角色和編輯角色回顯問(wèn)題的解決方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-10-10
jQuery 核心函數(shù)以及jQuery對(duì)象
首先介紹 jQuery 的幾個(gè)核心函數(shù)，在 jQuery 中它們起著至關(guān)重要的作用，在實(shí)際的前端開(kāi)發(fā)過(guò)程中用到最多的也是它們。
2010-03-03
基于jQuery實(shí)現(xiàn)的QQ表情插件
大家在qq聊天或者是玩微信時(shí)發(fā)表自己的心情，都會(huì)允許加入表情，大家知道qq表情是怎么實(shí)現(xiàn)的嗎，接下來(lái)，通過(guò)本篇文章給大家實(shí)例講解基于jQuery實(shí)現(xiàn)的QQ表情插件，需要的朋友可以參考下
2015-08-08
jQuery插件slider實(shí)現(xiàn)拖動(dòng)滑塊選取價(jià)格范圍
jquery滑塊（slider）允許用戶從一個(gè)有限的范圍內(nèi)選擇一個(gè)數(shù)值。當(dāng)沿著軌道移動(dòng)滑塊控件時(shí)，將顯示一個(gè)表示當(dāng)前值的提示框，用戶可通過(guò)設(shè)置它的屬性來(lái)自定義滑塊。
2015-04-04
jQuery實(shí)現(xiàn)淡入淡出二級(jí)下拉導(dǎo)航菜單的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)淡入淡出二級(jí)下拉導(dǎo)航菜單的方法,涉及jquery簡(jiǎn)單操作頁(yè)面元素展開(kāi)與隱藏的實(shí)現(xiàn)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
2015-08-08