Question

I am trying to reload the content of a div without actually refreshing the page, the problem is that I just need to reload the div not to load another different page. I’ve been trying to use the code below but it doesn’t load the div I need and it gets stuck in a loop after first refresh (refreshing every 1 sec). Or is there any way to restart a jQuery animation every 5 sec?

var refreshId = setInterval(function() {  
    $('#wrapper').fadeOut("slow").load('../index.php#wrapper').fadeIn("slow");
    }, 5000);

Answer 1

I think you want setTimeout instead of setInterval. setInterval sets up a repeating timeout, which doesn’t seem to be what you want

var refreshId = setTimeout(function(){ 
     $('#wrapper').fadeOut("slow").load('../index.php#wrapper').fadeIn("slow");
}, 5000);

Also, I think you want to pass a callback to load, to be sure you’re fading it back in only after the ajax request is complete.

var refreshId = setTimeout(function(){ 
     $('#wrapper').fadeOut("slow").load('../index.php#wrapper', 
                      function() { $("#wrapper").fadeIn("slow") });
}, 5000);