I’m trying to customize a wordpress plugin called wp post listing. I want to target the #basic-waypoint-cyberwrath that wraps the load more button because the plugin doesn’t have an automation. It needs to manually click the load more button in which I don’t like it.
This is the code that I have got so far for inview:
$('#basic-waypoint-cyberwrath').each(function() {
new Waypoint.Inview({
element: this,
enter: function(direction) {
},
entered: function(direction) {
//animatelettering.textillate('in')
$('.wpp_loadmore_pager').click();
},
exit: function(direction) {
//animatelettering.textillate('out')
},
exited: function(direction) {
}
});
});
And this is the code that I got so far for waypoint:
var $fusionheader = $('#basic-waypoint-cyberwrath');
$fusionheader.waypoint(function(direction) {
if (direction === 'down') {
// do stuff
//alert('I am going down');
$('.wpp_loadmore_pager').click();
}
jQuery.waypoints('refresh');
}, { offset: '90%' });
I already tried almost everything. I dont know anymore what am I missing here. Both are good when scrolling down for the first time and then triggers when it sees the #basic-waypoint-cyberwrath but it doesn’t trigger anymore for round 2 and so on the load more button in order to see the other post listings.
I even tried a for loop statement but still no luck:
var discreteElements = document.getElementById('basic-waypoint-cyberwrath')
for (var i = 0; i < discreteElements.length; i++) {
new Waypoint.Inview({
element: this,
enter: function(direction) {
},
entered: function(direction) {
//animatelettering.textillate('in')
$('.wpp_loadmore_pager').click();
},
exit: function(direction) {
//animatelettering.textillate('out')
},
exited: function(direction) {
}
});
};
Please help.