每秒鐘縮放一幅圖片jQuery

Question

我嘗試使用縮放每一秒來爲圖片製作動畫，但當我加載我的頁面時它工作正常，但是我希望每秒鐘都有一次。我想當我使用我的圖像相同的ID時，這是一個問題。

這是我的JSFIDDLE。

謝謝。

Answer 1

您使用setTimeout將執行一段時間後的某些代碼，你想要的是setInterval，它會每隔一段時間執行一些代碼。 http://jsfiddle.net/UxTdU/3/

Answer 2

您可以在一個時間間隔內增加zoom屬性。

setInterval(function(){ 
    $("#myImg").animate({"zoom":"+=.025"}, 500); 
}, 1000); 

小提琴：http://jsfiddle.net/UxTdU/6/

你甚至可以放大它以特定的大小，然後停止：

// Cache reference to image 
var $image = jQuery("#myImg"); 

// Cache reference to zooming interval 
var zooming = setInterval(function(){ 

    // If current zoom is under 1.5 
    $image.css("zoom") < 1.5 

     // Increment zoom by .025 
     ? $image.animate({"zoom":"+=.025"}, 500) 

     // Otherwise, stop zooming 
     : clearInterval(zooming); 

// Run every 1 second 
}, 1000); 

小提琴：http://jsfiddle.net/UxTdU/8/

Answer 3

http://jsfiddle.net/UxTdU/5/ - 使用setInterval，而不是setTimeout。 setTimeout只發生一次。