Javascript jQuery移动元素，然后固定它并水平移动它

我试图在上实现效果，但我只需要在滚动的基础上移动一些东西。我的目标是让篮球进入框中，然后向下滚动一点，框进入卡车，所有的物体水平地穿过页面。另外，我希望这种情况发生在你向下滚动时，而不是像当前小提琴那样向上滚动时

这里是我现在的，原来是基于这个。下面是js

  var fixedElement = false;
  var changingMoment = 150;
$(window).scroll(function() {
// floatingContentMark lets us know where the element shall change from fixed to relative
// and vice versa
 var distanceFromTop = $("#floatingContentMark").offset().top - $(this).scrollTop();    
   if ((distanceFromTop <= changingMoment && !fixedElement) || 
    (distanceFromTop >= changingMoment && fixedElement)) 
     {    // either we came from top or bottom, same function is called
      fixedElement = !fixedElement;
     $('#box').trigger('fixElement');
     }
  });

 $('#box').bind('fixElement', function() {
  if ($(this).css('position') != 'fixed') {
    $(this).css('position', 'fixed') ;
    $(this).css('top', changingMoment) ;
}
else {
    $(this).css('position', 'relative') ;
    $(this).css('top', 'auto') ;
}
}) ;

var fixedElement=false；
var变化力矩=150；
$（窗口）。滚动（函数（）{
//浮动内容标记让我们知道元素将从固定位置更改为相对位置
//反之亦然
var distanceFromTop=$（“#floatingContentMark”）.offset（）.top-$（this.scrollTop（）；
if（（与顶部的距离=变化力矩和固定元件））
{//无论我们是从上还是从下，都调用相同的函数
fixedElement=！fixedElement；
$（'框'）.trigger（'固定元素'）；
}
});
$（'#box'）.bind（'fixement'，function（））{
if（$（this.css（'position'）！='fixed'）{
$（this.css（'position'，'fixed'）；
$（this.css（'top'，changingMoment）；
}
否则{
$（this.css（'position'，'relative'）；
$（this.css（'top'，'auto'）；
}
}) ;

我认为，如果您使用框架或jQuery插件进行自定义/视差滚动，您的项目将容易得多。快速的谷歌搜索会带来几个可以轻松满足您需求的功能：

---

要获得一些灵感，请查看列出的页面。

您是否有特定的问题，还是希望我们为您编写其余的代码？