JQuery Div在滚动期间跟随顶部/底部间隙

时间:2013-01-31 23:22:12

标签: jquery html scroll fixed

滚动页面时我需要一个固定的div,但是在顶部和底部值之间。 现在我有这个代码,它的工作原理,但我无法找到解决方案来阻止它与滚动我找到页面的底部.. 我想要一个400px的底部间隙(我的页脚的高度)..

jQuery(document).ready(function () {
    var el = jQuery('#news_right_cont');
    var elpos = el.offset().top;
    var gap = 174;
    jQuery(window).scroll(function () {
        var y = jQuery(this).scrollTop();
        if (y < elpos) {
            el.stop().animate({
                'top': 174
            }, 0);
        } else {
            el.stop().animate({
                'top': y - elpos + gap
            }, 0);
        }
    });
});

我希望你能找到解决方案.. 感谢

1 个答案:

答案 0 :(得分:0)

您可以使用以下内容查找滚动是否已到达页面底部

 if (document.documentElement.clientHeight + y >= document.body.offsetHeight) {
        //add your conditions                
    }

而不是你的if else

if (y < elpos) {
            el.stop().animate({
                'top': 174
            }, 0);
        } else {
            el.stop().animate({
                'top': y - elpos + gap
            }, 0);
        }

添加以下内容

if (document.documentElement.clientHeight + y + 400 < document.body.offsetHeight) {
                             el.stop().animate({ top: y - elpos + gap }, 0);
            }

您基本上只在限制范围内滚动。 `document.documentElement.clientHeight + y + 40中的数字400可以根据页脚位置进行修改