Variable Visions

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



RECENT ARTICLES:

PUBLISHED ON 03.3.20arrowWordpress and Woocommerce widget for inserting PHP in Elementor

PUBLISHED ON 09.5.19arrowWordpress and Woocommerce redirect to a product page from categories with a single product

TAGS

CATEGORIES