<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>

方法說明：
由頁面總高度減去已滾動(dòng)的高度再減去ID為widget的層的高度即等于該層底部距離底部的高度；
當(dāng)距離底部的高度小于或等于特定位置距離底部的高度時(shí)，去掉樣式fixed，然后給該層添加絕對(duì)定位！
CSS中要給父父層添加position:relative;

您可能感興趣的文章:

相關(guān)文章

純JAVASCRIPT圖表動(dòng)畫插件Highcharts Examples
官方提供免費(fèi)的下載包以及詳細(xì)的文檔說明，非常的值得收藏。
2011-04-04
jquery鍵盤事件使用介紹
jquery鍵盤事件使用介紹，需要的朋友可以參考下。
2011-11-11
jQuery timers計(jì)時(shí)器簡單應(yīng)用說明
大家都知道jQuery很強(qiáng)大，也有很多效果很帥的插件，下面介紹下jQuery定時(shí)器插件jQuery Timers，那JS都自帶有定時(shí)器，為什么要使用Jquery的呢？
2010-10-10
jquery動(dòng)態(tài)導(dǎo)航插件dynamicNav用法實(shí)例分析
這篇文章主要介紹了jquery動(dòng)態(tài)導(dǎo)航插件dynamicNav用法,較為詳細(xì)的分析了jquery導(dǎo)航插件的原理及具體使用方法,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-09-09
如何選擇jQuery版本 1.x? 2.x? 3.x?
這篇文章主要給大家介紹了關(guān)于如何選擇jQuery版本，是1.x? 2.x?還是3.x? 在選擇使用jquery之前我們常常會(huì)考慮jQuery應(yīng)該選擇什么版本?現(xiàn)在jquery一般用什么版本以及jquery ie8的兼容版本和jquery什么版本穩(wěn)定等問題，下面通過這篇文章來看看詳細(xì)的介紹吧。
2017-04-04
jquery實(shí)用代碼片段集合
學(xué)習(xí)jquery與正在使用jquery的朋友可以參考下。很多使用的代碼，可以直接拿來使用。
2010-08-08
淺談jquery高級(jí)方法描述與應(yīng)用
下面小編就為大家?guī)硪黄獪\談jquery高級(jí)方法描述與應(yīng)用。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-10-10
jQuery創(chuàng)建插件的代碼分析
jQuery創(chuàng)建插件的代碼分析，需要的朋友可以參考下。
2011-04-04
jquery中使用ajax獲取遠(yuǎn)程頁面信息
當(dāng)我們點(diǎn)擊表格里面的標(biāo)題顯示相關(guān)的詳細(xì)信息，比如點(diǎn)擊新聞標(biāo)題顯示正文，而正文通常是在一個(gè)頁面里面，通過獲取傳遞的參數(shù)id查詢數(shù)據(jù)庫，然后顯示出來
2011-11-11
jQuery表單驗(yàn)證功能實(shí)例
這篇文章主要介紹了jQuery表單驗(yàn)證功能,涉及jquery針對(duì)表單項(xiàng)的讀取與正則判定技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
2015-08-08