位置:固定在补充工具栏 - 如何在页脚之前停止?

时间:2013-01-11 23:15:56

标签: jquery

我在侧边栏中使用jQuery浮动小部件 - 链接到我的帖子http://www.product-investigation.com/fat-loss-factor-review - 如果向下滚动,你可以看到我的意思..我想在页脚栏前停止我的adsense小部件..谢谢你的帮助:)

我的javascript

<script>
$(document).ready(function() {
        function isScrolledTo(elem) {
            var docViewTop = $(window).scrollTop(); //num of pixels hidden above current screen
            var docViewBottom = docViewTop + $(window).height();
            var elemTop = $(elem).offset().top; //num of pixels above the elem
            var elemBottom = elemTop + $(elem).height();
            return ((elemTop <= docViewTop));
        }
        var catcher = $('#catcher');
        var sticky = $('#sticky');
        $(window).scroll(function() {
            if(isScrolledTo(sticky)) {
                sticky.css('position','fixed');
                sticky.css('top','100px');
            }
            var stopHeight = catcher.offset().top + catcher.height();
            if ( stopHeight > sticky.offset().top) {
                sticky.css('position','absolute');
                sticky.css('top',stopHeight);
            }
        });
    });
    </script> 

1 个答案:

答案 0 :(得分:3)

我已更新您的jsfiddle。我改变了你的条件:

return ((elemTop <= docViewTop || elemTop >= docViewTop)); //Changed your return in isScrolledTo

说明:我在下面添加的代码会将sticky div放在footer的顶部,如果我使用您原来的return语句并向上滚动,{{1在sticky之上,div的位置仍然是absolute。这是因为您的footer语句只会检查元素的return位置是否小于或等于top值,而scrollTop()值只能在scrolldown期间使用。在sticky已位于底部的情况下,isScrolledTo()还应检查top div的sticky是否大于或等于{{1}价值。

并在scrollTop()

中添加了一些内容
.scroll()

希望它有所帮助。