【问题标题】:JQuery Div follow during scrolling with top/bottom gapJQuery Div 在滚动时跟随顶部/底部间隙
【发布时间】:2013-01-31 23:22:12
【问题描述】:

滚动页面时我需要一个固定的 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);
        }
    });
});

希望你能找到解决办法.. 谢谢

【问题讨论】:

  • 很抱歉,我发现您的编码风格难以阅读

标签: jquery html scroll fixed


【解决方案1】:

你可以使用下面的方法来查找滚动条是否到达了页面底部

 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 你可以根据你的页脚位置进行修改

【讨论】:

  • 谢谢 arun..但是如何在我的函数中实现它..我已经尝试过但我找不到解决方案..
  • 添加了更多的 cmets..让我知道这是否有帮助
  • oops..需要更多信息 1. 分享你的 div 标签 #news_right_cont' 2.添加警报 (document.documentElement.clientHeight);警报(document.body.offsetHeight);在你的 if 循环之前并分享你的号码。
  • 它给了我 749 和 0.. div 不跟随滚动...现在我很困惑.. :)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-05-03
  • 2012-07-30
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多