js中scrollTop()方法和scroll()方法用法示例
本文實例講述了js中scrollTop()方法和scroll()方法用法。分享給大家供大家參考,具體如下:
設(shè)置滾動條據(jù)頂部的高度:
$("div").scrollTop(100); //把 scroll top offset 設(shè)置為 100px
獲得滾動條的高度:
$("div").scrollTop();//獲得 scroll top offset
觸發(fā)滾動事件
$(selector).scroll()
將函數(shù)綁定到滾動事件中:
$(selector).scroll(function)
監(jiān)聽滾動事件,判斷當滾動到距離頂部700px時,將其position改為fixed:
$(window).scroll(function(){ var $scroll_height = $(".gray").scrollTop(); if($scroll_height > 700){ $(".hot-nav").addClass("fix-nav"); } else { $(".hot-nav").removeClass("fix-nav"); } })
這是jquery中的用法,
offset() 獲取匹配元素在當前視口的相對偏移。
返回的對象包含兩個整形屬性:top 和 left。此方法只對可見元素有效。
top:$(this).offset().top+25+"px"
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動畫特效與技巧匯總》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
相關(guān)文章
smartupload實現(xiàn)文件上傳時獲取表單數(shù)據(jù)(推薦)
這篇文章主要介紹了smartupload實現(xiàn)文件上傳時獲取表單數(shù)據(jù)的相關(guān)資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-12-12js中如何復(fù)制一個數(shù)組(淺復(fù)制、深復(fù)制)
這篇文章主要介紹了js中如何復(fù)制一個數(shù)組(淺復(fù)制、深復(fù)制)問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2023-04-04js實現(xiàn)無限層級樹形數(shù)據(jù)結(jié)構(gòu)(創(chuàng)新算法)
這篇文章主要介紹了js實現(xiàn)無限層級樹形數(shù)據(jù)結(jié)構(gòu),文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02javascript實現(xiàn)判斷鼠標的狀態(tài)
這篇文章主要介紹了javascript實現(xiàn)判斷鼠標的狀態(tài)的相關(guān)代碼,十分簡單實用,有需要的小伙伴可以參考下。2015-07-07學(xué)習(xí)JavaScript中的閉包closure應(yīng)該注意什么
這篇文章主要介紹了學(xué)習(xí)JavaScript中的閉包closure應(yīng)該注意什么?在?JavaScript?中,?每當創(chuàng)建一個函數(shù),?閉包就會在函數(shù)創(chuàng)建的同時被創(chuàng)建出來,但是學(xué)習(xí)的時候我們應(yīng)該注意哪些問題呢,帶著疑問一起進入下面文章學(xué)習(xí)具體內(nèi)容吧2022-06-06JavaScript實現(xiàn)文件下載的超簡單兩種方式分享
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)文件下載的超簡單兩種方式,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-12-12JS組件Bootstrap Table表格多行拖拽效果實現(xiàn)代碼
這篇文章主要介紹了JS組件Bootstrap Table表格多行拖拽效果實現(xiàn)代碼,需要的朋友可以參考下2015-12-12