1

Simple question: I need this function to loop infinitely. I've tried setTimeout (I added up the time for all the steps to execute).

<script type="text/javascript">
  $(document).ready(function slideshow(){
    $('#slide1').show(500).delay(500)
      .animate({width:'240px'}).delay(500)
      .animate({height:'50px', width:'410px'}).delay(1500)
      .hide(500)
  });
</script>
6
  • 2
    you shouldnt be looping ready function what do you want to achieve?
    – Kishore
    Jun 7, 2013 at 5:52
  • you can use setInterval instead of setTimeout too
    – igor
    Jun 7, 2013 at 5:53
  • setTimeout should be used for higher precission Jun 7, 2013 at 6:18
  • @kitty setInterval in combination with jQuery animations is not the best idea (i generally avoid using setInterval). The animations (including delay) are queueable, and this could lead into a growing animation queue if the interval time is chosen wrong (to small value) and you would only notice that if you look at the constantly growing memory usage.
    – t.niese
    Jun 7, 2013 at 6:26
  • i need this to start running onload and keep looping infinitely. for this, what would be my setTimeout value? also, setInterval messes up the order of the animation
    – Zack Chan
    Jun 7, 2013 at 6:36

2 Answers 2

4

Try

jQuery(function($){
    function anim(){
        $('#slide1').show(500).delay(500)
        .animate({width:'240px'}).delay(500)
        .animate({height:'50px', width:'410px'}).delay(1500)
        .hide(500, function(){
            setTimeout(anim, 500)
        })
    }
    anim();
})
1
  • hey i tried that, it loops but messes up the order of the animation after it runs for the first time :/
    – Zack Chan
    Jun 7, 2013 at 6:43
0
setInterval(function() {
    $('#myelem').stop().animate({ changes }, 500);
}, 1000);

Every second your element with animate with whatever properties you want it to. You can use setTimeout, although setInterval is designed for looping. Either works.

The key difference with my answer is the use of stop(). It stops the previous animation, preventing any weird double-up bugs.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.