在页脚固定浮动元素停止

我使用http://jqueryfordesigners.com/fixed-floating-elements的代码在滚动到某个点后浮动元素。以下是我正在处理的网站：http://bodyecology.com/articles/gut-type-update 在页脚固定浮动元素停止

正如您所看到的，右侧列在滚动时变得固定，但在页脚重叠。我怎样才能让它停在页脚之上？

目前正在使用：

<script> 
    jQuery(document).ready(function() { 
    var top = jQuery('#news_sidebar').offset().top - parseFloat(jQuery('#news_sidebar').css('marginTop').replace(/auto/, 0)); 
    jQuery(window).scroll(function (event) { 

     var y = jQuery(this).scrollTop(); 

     if (y >= top) { 

     jQuery('#news_sidebar').addClass('fixed'); 

     } else { 

     jQuery('#news_sidebar').removeClass('fixed'); 
    } 
    }); 
}); 
</script>

来源

2011-05-23 markramos83

这拨弄做你在找什么：

http://jsfiddle.net/ZczEt/9/

这里是右侧手柄浮动元素$（ '＃摘要'）的JavaScript：

$('#summary').scrollToFixed({ 
    marginTop: 
     $('.header').outerHeight() + 10, 
    limit: 
     $('.footer').offset().top - 
     $('#summary').outerHeight() - 
     10 
});

这里是jQuery的插件及其来源：

https://github.com/bigspotteddog/ScrollToFixed

来源

2011-09-04 00:25:05 bigspotteddog

像魅力一样工作，谢谢！ – markramos83 2011-12-06 16:33:53

很高兴工作。这是一个有趣的要求弄清楚:) – bigspotteddog 2011-12-12 19:07:25

@bigspotteddog我很尴尬，如此无耻地劫持这条评论线程，但我想不出另一种方式来私下给你发消息。我很努力地使用你的插件scrolltofixed正确。如果你想快速看看[我的这个stackoverflow问题]（http://stackoverflow.com/questions/10987447/scroll-multiple-sidebar-divs-down-the-screen-like-9gag-com-does/ 10989465）我会永远感激。 – billmalarky 2012-06-16 09:29:42

我可能是错的，但它似乎是正确的侧边栏里面的内容的大小。它重叠，因为它太大，而不是当你滚动到底部时。

您可以在底部放置相同的停止位置并重新放置在顶部。当您滚动到顶部时，它会重新定位。尝试用于页脚。

来源

2011-05-23 20:49:21 tahdhaze09

是的，我改变了它，所以它不是那么大。设想你的视口要小得多，并且元素会重叠页脚。我想把它做得更大，但要在页脚之前停下来。我会在脚本中添加什么来阻止脚注？ – markramos83 2011-05-26 15:06:40

我已将此页面添加为我想要做的示例：http://bodyecology.com/example.html。注意元素现在更长，所以它重叠了页脚。 – markramos83 2011-05-26 16:49:59

我有相同的代码，你浮我的DIV 从同一岗位“固定 - 浮动元素”

，并有同样的问题，因为你有重叠的页脚，唯一的解决办法为我工作（我“M一个javascript newvie）从页脚与此代码拉动DIV远：

$(window).scroll(function() { 

      // distance from top of footer to top of document 
      footertotop = ($('#footer').position().top); 
      // distance user has scrolled from top, adjusted to take in height of sidebar (570 pixels inc. padding) 
      scrolltop = $(document).scrollTop() + 570; 
      // difference between the two 
      difference = scrolltop - footertotop; 

      // if user has scrolled further than footer, 
      // pull sidebar up using a negative margin 

      if (scrolltop > footertotop) { 

       $('#cart').css('margin-top', 0 - difference); 
      } 

      else { 
       $('#cart').css('margin-top', 0); 
      } 


     });

这对我很有帮助，我希望别人会发现它的帮助:) 我实现它在我的网站，以便用户可以得到full articles view

来源

2013-02-02 07:26:32

在页脚固定浮动元素停止

回答

相关问题