Run WordPress ajax function only if div is visible

Question

I have an AJAX function running in Wordpress to fetch 5 of the latest posts, but I would like to run this function only when the user scrolls to a point on the page where a specific div is visible - is this possible using jQuery?

My code so far looks like…

jQuery.ajax({
    type: 'POST',
    url: '/wp-admin/admin-ajax.php',
    data: {
        action: 'get_latest', // the PHP function to run
    },
    success: function(data, textStatus, XMLHttpRequest) {
        jQuery('#posts-load').html(''); // empty an element
        jQuery('#posts-load').append(data); // put our list of links into it
    }
});

simply put condition `if( $('div').is(':visible') ){ \\do your stuff here }` — Rohil_PHPBeginner, Jun 03 '15 at 11:18
possible duplicate of [Check if element is visible after scrolling](http://stackoverflow.com/questions/487073/check-if-element-is-visible-after-scrolling) — fsacer, Jun 03 '15 at 11:19

score 0 · Answer 1 · answered Jun 03 '15 at 11:57

0

You should use waypoints.

var waypoint = new Waypoint({
  element: document.getElementById('#matching_div'),
  handler: function(direction) {
    // your ajax call
  }
})

Waypoints library is available here: http://imakewebthings.com/waypoints/

answered Jun 03 '15 at 11:57

dtx

199
10

Run WordPress ajax function only if div is visible

1 Answers1