javascript - 自定义视差

我正在尝试创建我自己的自定义视差插件，以便我能够选择项目从屏幕上转移的方向，我只是坚持确保无论用户如何滚动，无论窗口大小，对象在正确的点消失。
目前我有：

var lastScrollTop = 0;
var logoStartPos = $('.bg-logo').position().left;
$(function(){
   $(window).scroll(function(){

       var st = $(this).scrollTop();
       if (st > lastScrollTop){
          if($('.bg-logo').is(':in-viewport'))
            $('.bg-logo').css({'left':($('.bg-logo').position().left+10) + "px"});
       } else {
          if($('.bg-logo').is(':in-viewport') && logoStartPos < $('.bg-logo').position().left)
            $('.bg-logo').css({'left':($('.bg-logo').position().left-10) + "px"});
       }
       lastScrollTop = st;

   });
});

你可以猜到，这只会将项目向右移动，直到它离开屏幕。这种方式有不同的结果，因为如果我使用滚轮，它需要更长的时间消失，如果我使用滚动条。我也有另一个问题，如果我使用混合或有一个不同的视图端口，我得到一个不同的结果在一起。
有什么能达到我想要的结果的提示或建议吗？
我的代码的一个工作示例位于http://motoring.egl.me.uk
谢谢马特

最佳答案

有点过时了，但请注意。。。
在jQuery initialize或ready事件中，您需要初始化每个部分、文章、项或它是什么（item.each）来实例化一个滚动函数，以便每个部分都有自己的滚动函数。

this.each(function(index) {

然后在scroll函数中，仅处理事件（如果它是“当前”部分）。你需要一些方法来确定哪个项目是“当前”的。通常，这是通过将每个项的窗口大小保存到全局数组中，然后将其与当前位置进行比较来完成的。
例如：（您设计代码的方式可能会非常不同）

// If this section is in view
if ( ($window.scrollTop() + $window.height()) > (topOffset) &&
   ( (topOffset + $self.height()) > $window.scrollTop() ) )

这样，一旦一个项目离开屏幕，下一个项目应该成为“当前”并继续滚动。