Script Callback on Infinite Scroll WordPress
Hello!
I have the Infinite Scroll script setup to auto-load more posts at the end of the page. That part is working perfectly. But I just noticed that when new posts are added, the post doesn't get some of my JS applied to it, because it runs on page load. I'm running fitvid.js on posts to make the video embeds responsive.
According to Infinite Scroll, you can run callbacks to load those scripts when more posts are loaded. I've tried a few different ways but can't get it to execute the fitvid.js when more posts are loaded.
This is my code for Infinite Scroll (located in functions.php): http://snippi.com/s/o1qqc8t
This is my code for fitvid.js (located in custom.js): http://snippi.com/s/rgddnut
This is the github page for Infinite Scroll: https://github.com/paulirish/infinite-scroll
Any help would be much appreciated!
Mike
Answers (1)
Dbranes answers:
Hi, have you tried this:
//----------------------------------- // Add Infinite Scroll //-----------------------------------//
if ( get_option('okay_theme_customizer_infinite') == 'enabled' ) {
function custom_infinite_scroll_js() {
if( ! is_singular() ) { ?>
<script>
jQuery(document).ready(function($){
$(".fitvid").fitVids();
$(".posts").infinitescroll({
loading: {
img: "<?php echo get_template_directory_uri(); ?>/images/ajax-loader.gif",
msgText: "<?php _e( 'Loading more posts...', 'okay' ); ?>",
finishedMsg: "<?php _e( 'All posts loaded.', 'okay' ); ?>"
},
nextSelector : '.post-nav-right a',
navSelector : '.post-nav',
itemSelector : 'article',
contentSelector : '.posts'
}, function(newElements){
//callback
$(".fitvid").fitVids();
}
); // end infinite-scroll setup
});
</script>
<?php
}
}
add_action( 'wp_footer', 'custom_infinite_scroll_js',100 );
}
Dbranes comments:
ps:
maybe this is also helpful:
http://wildetuts.tumblr.com/post/33636287161/infinite-scroll-and-fitvids-plugin
Mike McAlister comments:
Hi Dbranes,
That doesn't seem to do the trick unfortunately!
Mike
Dbranes comments:
ok, I updated the code above
do you get any javascript error?