how to loop setTimeOut function

Question

i'm new on javascript and jquery , i create some function on this fiddle and it only run once, how to loop this function ??

    $(document).ready(function()  // function
    { 

     $('.box').css({visibility:'hidden'});

      setTimeout( function(){
        $('.box-1').css({visibility:'visible'});  
       },300);
      setTimeout( function(){
        $('.box-2').css({visibility:'visible'}); 
     },600);
     setTimeout( function(){
       $('.box-3').css({visibility:'visible'}); 
    },900);  
    setTimeout( function(){
      $('.box').fadeOut('slow'); 
   },1300);  
})

fiddle link https://jsfiddle.net/dzh5dgcf/

Arun P Johny · Accepted Answer · 2015-03-16 06:17:09Z

4

Use a setInterval()

$(document).ready(function () {

    function animate() {
        $('.box').css({
            visibility: 'hidden',
            display: ''
        });
        setTimeout(function () {
            $('.box-1').css({
                visibility: 'visible'
            });
        }, 300);
        setTimeout(function () {
            $('.box-2').css({
                visibility: 'visible'
            });
        }, 600);
        setTimeout(function () {
            $('.box-3').css({
                visibility: 'visible'
            });
        }, 900);
        setTimeout(function () {
            $('.box').fadeOut('slow');
        }, 1300);
    }
    animate()
    setInterval(animate, 1800)
});

Demo: Fiddle

answered Mar 16, 2015 at 6:17

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to loop setTimeOut function

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related