jquery - 当div到达某个点时如何固定它的位置

Question

我不能 100% 确定问题标题是否准确，因此如果有人可以准确解释我想做的事情，我愿意更改。

我有一个包含图像的div，并为第一个图像下的每个“项目”复制，我想做的是位置:当项目的第一个图像到达某个点时固定div，到目前为止我已经成功了当页面向右滚动时它。

它是如何工作的

它检查 div 的左侧位置相对于最初固定的 div 移动，然后如果它足够接近而不是比 (fixedLeft+400) 更近，则类交换，卡住的原始 div 继续其快乐的方式，而新的 div一根棍子。

它工作得很好，虽然没有经过彻底的测试，但我必须进行一些调试，但我试图让它返回原路，但我遇到了一个死胡同。

这是我的 fiddle - 大版本 = 图像可能太大 http://fiddle.jshell.net/tara_irvine/d5VdF/12/show/

以及代码为 http://jsfiddle.net/tara_irvine/d5VdF/12/ 的 fiddle 部分

代码删除了很多内容，因为我的内容是动态的，并且所有内容(内容和副本)都基于隐藏的导航，因此可能会被忽略。

即使有人可以告诉我它应该如何工作的逻辑，这也会有所帮助。

我真的希望有人能帮忙。非常感谢

Answer 1

向每个 li 元素添加行为似乎是解决问题的一种奇怪方法。我宁愿最初将第一个复制容器设置为固定复制，然后在 $(document).ready 中有一个 $(window).scroll 并跟踪它的偏移量。一旦达到一定的阈值，就改变类别。这也应该更容易逆转。

更新:这对我有用

$(document).ready(function(){
    $(window).scroll(function (){   
        var offset = $(".fixed-copy").offset().left;
        $(".fixed-copy").find(".offsetLeftGroupPrev").html(offset);     
        var next = $(".fixed-copy").parents("ul").next("ul.imgGroup").find(".copy-container");      
        var prev = $(".fixed-copy").parents("ul").prev("ul.imgGroup").find(".copy-container");  

        if(offset > next.offset().left){
            $(".fixed-copy").removeClass("fixed-copy");
            next.addClass("fixed-copy");
        }   

        if(prev!=null && prev.offset() != null){    
            if(offset < prev.offset().left){
                $(".fixed-copy").removeClass("fixed-copy");
                prev.addClass("fixed-copy");
            }
        }
   });  
});