Zoom An Image Every One Second Jquery

I try to animate an image with zooming every one second, it work when I load my page but I want it every one second. I think when I use the same id of my image it's a problem. This

Solution 1:

You're using setTimeout which will execute some code after a certain time, what you want is setInterval, which will execute some code every so often. http://jsfiddle.net/UxTdU/3/

Solution 2:

You could just increment the zoom property from within an interval.

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

Fiddle: http://jsfiddle.net/UxTdU/6/

You could even zoom it up to a particular size, then stop:

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

// Cache reference to zooming intervalvar 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);

Fiddle: http://jsfiddle.net/UxTdU/8/

Solution 3:

http://jsfiddle.net/UxTdU/5/ - use setInterval, not setTimeout. setTimeout happens only once.