如何循環。動畫JQuery

我正在使用一個單獨的div與內部的圖像。我需要動畫從頁面的左側滾動，然後回到右側並繼續循環。我在這裏查看了很多帖子，但無法使腳本正常工作。如何循環。動畫JQuery

'$(document).ready(function(){ 
    function loop() { 

     $('#clouds').animate({left: '+=1400',},50000, 'linear', function(){ 
      loop(); 
     });

HTML

< div id="clouds">< img border="0" alt="animated clouds" src="/images/clouds.png" />< /div>

CSS

#clouds { 
    position:absolute; 
    z-index:500; 
    right:0px; 
    top:10px; 
}

來源

2012-07-09 ac12

是'''在你的jQuery開始意向？ – SomeKittens 2012-07-09 19:15:40

不，它不是。我正在研究一個內容管理系統，這不完全是看起來很棒。但是，如果沒有添加「它仍然無法正常工作。 – ac12 2012-07-09 19:41:33

試試這個：

的jsfiddlehttp://jsfiddle.net/2YqH2/

你不是移動雲回右側。在循環功能中，我添加了

$('#clouds').css({right:0});

並且循環將從那裏繼續。我也改變了你的動畫，爲你的「正確」屬性設置了動畫，因爲你說你想讓雲從右向左移動。

另外，您的JavaScript格式不正確。確保你得到那些最後的括號和括號！這裏是固定的JavaScript。

$(document).ready(function() { 
    function loop() { 
     $('#clouds').css({right:0}); 
     $('#clouds').animate ({ 
      right: '+=1400', 
     }, 5000, 'linear', function() { 
      loop(); 
     }); 
    } 
    loop(); 
});

來源

2012-07-09 19:24:11 tb11

我非常感謝這個！我正在進行實習，並且已經爲很多已經回答的問題提供了翻譯。我並沒有期待像我這樣的高調回應時間和善良。關於最後一個問題，我已經讀到'線性'減少了波動，但是還有其他方法嗎？我撞到了50000，但仍然很粗糙。 – ac12 2012-07-09 19:50:25

如果你可以發佈一個多div的例子，那也會很好。提前謝謝，我非常感謝！ – ac12 2012-07-09 20:09:10

JAVASCRIPT：

$(document).ready(function() { 

    $('#clouds').click(function() { 
loop();  
    }); 

function loop(){ 
    alert('a'); 
     $('#clouds').animate({ 
      opacity: 0.25, 
      left: '+=1400', 
      height: 'toggle' 
     }, 5000, 'linear', function() { 
      loop(); 
     }); 

} 

});

HTML：

<div id="clouds"><img border="0" alt="animated clouds" src="../img/image.png" /></div>

你的錯誤是你沒有調用函數循環。看看如何it works,你可以刪除alert('a')，因爲它只是一個標誌，知道週期重新開始。現在您需要進行反向運動（如重置div，重新開始運動週期）。

來源

2012-07-09 19:18:02 jcho360

我正在處理工作中的內容管理系統，並導入了JQuery。我嘗試了上面的腳本，但仍然沒有任何動作。我也嘗試再次調用函數//動畫完成但沒有運氣。 – ac12 2012-07-09 19:42:10

你可以使用螢火蟲，並告訴我們的JavaScript錯誤訊息？ – jcho360 2012-07-09 19:44:36

他們沒有錯誤。 – ac12 2012-07-09 20:21:52

如何循環。動畫JQuery

回答

相關問題