一旦达到div就停止粘性引导列

我有两列简单的bootstrap行：

 
 
All the way with you
 
 
 
So happy to go
 
 
 
 
DON'T GO HERE.
  

感谢此脚本，ID为#stay的列将一直跟随第一列：

 $(document).ready(function() { (function($) { var element = $('#stay'), originalY = element.offset().top; // Space between element and top of screen (when scrolling) var topMargin = 10; // Should probably be set in CSS; but here just for emphasis element.css('position', 'relative'); $(window).on('scroll', function(event) { var scrollTop = $(window).scrollTop(); element.stop(false, false).animate({ top: scrollTop < originalY ? 0 : scrollTop - originalY + topMargin }, 300); }); })(jQuery); }); 

这是一个例子： https ： //jsfiddle.net/16vqvqev/7/ 。 我希望完成一旦它到达id为#stop的div后停止跟随列。

1. 我怎么能用这个js做到这一点？
2. 我尝试用affix bootstrap来做，但也没有走得太远……在那种情况下怎么样？

编辑：我的网站实际上有一些内容在行之前有粘性列，所以代码实际上是这样的： https ： //jsfiddle.net/16vqvqev/11/

Answer 1

您的问题现在通过对if语句的轻微调整来修复，而不是检查窗口的高度我检查了屏幕移动的最终位置，并根据该位置粘贴到#stop顶部或滚动就像以前一样

https://jsfiddle.net/dmitri_aleksejev/16vqvqev/8/

  top: scrollTop - originalY + topMargin + element.height() + parseInt(element.css("padding-bottom")) > end ? element.css("top", end - $(element).height() - 60) : scrollTop - originalY + topMargin 

代替：

 top: scrollTop < originalY ? 0 : scrollTop - originalY + topMargin