在特定的頂部滾動位置左右移動物體jquery

Question

我想從左至右，然後從右至左移動位置爲absolute的物體。我的目標是在一個特定的位置，從左邊說它是left:300px。當頂部滾動達到150px或更高時，我想讓對象向右移動到100px，使其離開變爲left:400px，然後停止。現在我們向下滾動多少。而當用戶滾動頂部和再滾動頂部變成0，對象移動再次通過100px向左並再次留下成爲left:300px;

我一直在努力jQuery animate和一個jQuery Transit plugin。當我使用jQuery animate時，它開始向右移動，然後不停地向下滾動並繼續向右移動。當我使用公交插件時，它向右移動100px，然後停在那裏。但無論哪種情況，當滾動達到0它不會移動到離開原來的位置我的代碼看起來像

$(window).on('scroll', 
     function() { 
      windowScrollTop = $(window).scrollTop(); 
      if (windowScrollTop == 0) { 
       //using transit plugin. It should move to left by 100 px; 
       $('.frameTwo .laptopClosed').transition({left: +100}, 1000, 'in'); 
       //$('.frameTwo .laptopClosed').animate({right: '+=100'}, 1000, 'linear'); 
      } 
      if (windowScrollTop >= 150) { 

       $('.frameTwo .laptopClosed').transition({x: 100}, 1000, 'in'); 
       //animate code commented 
       $('.frameTwo .laptopClosed').stop().animate({left: '+=100'}, 1000, 'linear'); 
      } 

     } 
); 

HTML

<div class="laptopClosed"> 
    <img src="laptopclosed.png"> 
</div> 

CSS

.laptopClosed { 
    left: -325px; 
    position: absolute; 
    top: 314px; 
} 

Answer 1

嘗試使用-=100時srollTop=0 like，

if (windowScrollTop == 0) { 
    //using transit plugin. It should move to left by 100 px; 
    $('.frameTwo .laptopClosed').transition({left: '-=100'}, 1000, 'in'); 
    // ------------------------ Use negative sign --^ here 
}