Articles jQuery Javascript-setInterval-with-random-content-loaded-with-AJAX-PART-2

---

tutorials - jQuery and Web-Development.

Javascript setInterval with random content loaded with AJAX - PART 2

Published Fri. Sep. 07, 2012

---

The below function was written to display six random articles by fading in and out with the addition of pausing on mouse hover

/* EVERY FIVE SECONDS THE PHP FILE WITH ARRAY WILL LOAD VIA AJAX INTO THE CONTAINER ID AFTER THE FIRST ARRAY IS FADED OUT QUICKLY AND THEN DELAY THE LOAD BY ONE SECOND AND FADE IN THE NEXT IN ONE SECOND */

 

var hoverpause = false;
   
function loadLoad() {
    if (hoverpause) return;
    jQuery('#container').fadeOut(100).load('/file.php?limit=6').delay(1000).fadeIn(1000);
}



jQuery(document).ready(function(){

    window.setInterval(function(){   
        loadLoad();
    },5000);
   
    $("#container").hover(
      function () { hoverpause = true; },
      function () { hoverpause = false; }
    );
   
   
});  

Tag(s): window.setInterval, .delay, .fadeIn, .fadeOut, hover pause