jQuery this（）循環問題

Question

我正在嘗試使用jQuery在頁面上動畫雲，並在它們離開最左側時將它們移動到頁面的末尾。

<div class="sprite cloud" id="cloud-1"> </div> 

 

$(function() { 
    function runIt() { 

    $(".cloud").each(function(){ 

     var speed = 20; 
     var Position = this.position().left; 
     var Width = this.width(); 
     if((Position + Width) < 0) 
     { 
      Position = $(document).width(); 
      this.css("left", Position); 
     } 

    }); 

    $('#clouds').animate({"left": Position-speed},1000, "linear", runIt)} 
    runIt(); 
}); 

它的工作原理，如果我使用$（ '＃雲-1'），等等，但如果我嘗試使用每個（）。我得到那個說

對象＃有沒有方法「位置」

我得到同樣的錯誤任何功能，如膠印（）的錯誤。

$（this）而不是解決它。

新代碼：

$(function() { 
    function runIt() { 

    $(".cloud").each(function(){ 

    var speed = 20; 
    var cloudPosition = $(this).position().left; 
    var cloudWidth = $(this).width(); 

    if((cloudPosition + cloudWidth) < 0) 
    { 
     cloudPosition = $(document).width(); 
     $(this).css("left", cloudPosition); 
    } 

    $(this).animate({"left": cloudPosition-speed},1000, "linear", runIt) 

    }); 


} 

    setInterval(runIt, 1000) 
}); 

它只是現在動畫一次。我認爲這是因爲runIt回調現在在一個循環中。我試圖把它移到循環之外，但沒有奏效。使用setInterval的工程確定，但很可能是不正確的方式做

Answer 1

.position是jQuery的對象的方法，並this內each是一個DOM對象。

您需要使用width$(this).position

而同樣和css