jQuery判斷div隨滾動條滾動到一定位置后停止
更新時間：2014年04月02日 10:42:09 作者：
這篇文章主要介紹了jQuery判斷div隨滾動條滾動到一定位置后停止的方法,需要的朋友可以參考下
實現(xiàn)代碼:
復制代碼 代碼如下:
<script type="text/javascript">
var rollSet = $('#widget');
var offset = rollSet.offset();
var fwidth = $("#footer").height();
$(window).scroll(function() {
var scrollTop = $(window).scrollTop();
var scrollBtm = $(document).height() - $(window).scrollTop() - $("#widget").height();
if (offset.top < scrollTop) {
if (scrollBtm > fwidth) {
rollSet.removeClass('absolute').addClass('fixed')
} else {
rollSet.removeClass('fixed').addClass('absolute')
}
} else {
rollSet.removeClass('fixed')
}
})
</script>
方法說明：
由頁面總高度減去已滾動的高度再減去ID為widget的層的高度即等于該層底部距離底部的高度；
當距離底部的高度小于或等于特定位置距離底部的高度時，去掉樣式fixed，然后給該層添加絕對定位！
CSS中要給父父層添加position:relative;
相關(guān)文章
純JAVASCRIPT圖表動畫插件Highcharts Examples
官方提供免費的下載包以及詳細的文檔說明，非常的值得收藏。2011-04-04
jquery鍵盤事件使用介紹，需要的朋友可以參考下。2011-11-11
大家都知道jQuery很強大，也有很多效果很帥的插件，下面介紹下jQuery定時器插件jQuery Timers，那JS都自帶有定時器，為什么要使用Jquery的呢？2010-10-10
jquery動態(tài)導航插件dynamicNav用法實例分析
這篇文章主要介紹了jquery動態(tài)導航插件dynamicNav用法,較為詳細的分析了jquery導航插件的原理及具體使用方法,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09
這篇文章主要給大家介紹了關(guān)于如何選擇jQuery版本，是1.x? 2.x?還是3.x? 在選擇使用jquery之前我們常常會考慮jQuery應該選擇什么版本?現(xiàn)在jquery一般用什么版本以及jquery ie8的兼容版本和jquery什么版本穩(wěn)定等問題，下面通過這篇文章來看看詳細的介紹吧。2017-04-04
學習jquery與正在使用jquery的朋友可以參考下。很多使用的代碼，可以直接拿來使用。2010-08-08
下面小編就為大家?guī)硪黄獪\談jquery高級方法描述與應用。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-10
jQuery創(chuàng)建插件的代碼分析，需要的朋友可以參考下。2011-04-04
當我們點擊表格里面的標題顯示相關(guān)的詳細信息，比如點擊新聞標題顯示正文，而正文通常是在一個頁面里面，通過獲取傳遞的參數(shù)id查詢數(shù)據(jù)庫，然后顯示出來2011-11-11
這篇文章主要介紹了jQuery表單驗證功能,涉及jquery針對表單項的讀取與正則判定技巧,非常具有實用價值,需要的朋友可以參考下2015-08-08