当前位置：文江博客话题详情

使 div 粘在屏幕顶部并在到达页脚之前停止

发布于 2024-12-10 14:36:35 字数 439 浏览 0 评论 0原文

我试图在用户开始向下滚动页面后将 div 粘在标题上。我找到了例子如何让 div 滚动到屏幕顶部后粘在屏幕顶部？

我使用了有 24 票的代码。现场演示。

问题： 1.我想让div在到达页脚之前停止。我不想在页脚上显示它。 2.我不知道为什么这适用于jquery 1.3.2但不适用于1.5.2或更高版本。

当然任何其他jquery代码/插件或ideea都会很棒！

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

疧_╮線 2024-12-17 14:36:35

$(window).load($(function()
{
    var elem = $("#scroller");
    var top = elem.offset().top;
    var maxTop = $("#footer").offset().top - elem.height();
    var scrollHandler = function()
    {
      var scrollTop = $(window).scrollTop();
      if (scrollTop<top) {
        elem.css({position:"relative",top:""})//should be "static" I think
      } else if (scrollTop>maxTop) {
        elem.css({position:"absolute",top:(maxTop+"px")})
      } else {
        elem.css({position:"fixed",top:"0px"})
      }
    }
    $(window).scroll(scrollHandler);scrollHandler()

}));

小提琴： http://fiddle.jshell.net/3ATzd/2/show/
只是认为它不喜欢#scroller 上的边距顶部。我还删除了对滚动锚点元素的需要，因此您可以删除它。

$(window).load($(function()
{
    var elem = $("#scroller");
    var top = elem.offset().top;
    var maxTop = $("#footer").offset().top - elem.height();
    var scrollHandler = function()
    {
      var scrollTop = $(window).scrollTop();
      if (scrollTop<top) {
        elem.css({position:"relative",top:""})//should be "static" I think
      } else if (scrollTop>maxTop) {
        elem.css({position:"absolute",top:(maxTop+"px")})
      } else {
        elem.css({position:"fixed",top:"0px"})
      }
    }
    $(window).scroll(scrollHandler);scrollHandler()

}));

fiddle: http://fiddle.jshell.net/3ATzd/2/show/
Only think is it doesn't like the margin-top on #scroller. I also removed the need for the scroller-anchor element, so you can remove this.

回复收藏 0 原文

~没有更多了~