jQuery 每隔一秒缩放一次图像答案

【问题标题】：Zoom an image every one second jQueryjQuery 每隔一秒缩放一次图像
【发布时间】：2012-10-17 23:07:36
【问题描述】：

我尝试以每秒缩放一次的方式为图像设置动画，当我加载我的页面时它可以工作，但我希望每秒一次。我认为当我使用图像的相同 id 时会出现问题。

这是我的JSFIDDLE。

谢谢。

【问题讨论】：

标签： javascript jquery jquery-animate

【解决方案1】：

您正在使用setTimeout，它将在一段时间后执行一些代码，您想要的是setInterval，它将每隔一段时间执行一些代码。 http://jsfiddle.net/UxTdU/3/

【讨论】：

【解决方案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/

【讨论】：

而你修正了他的逻辑……啊，主动！ (:

【解决方案3】：

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

【讨论】：