Browse: Home / Snippets /

Modify pager content change event with JavaScript

Contents


Snippet #

Important: All snippets are provided as-is without support or guarantees. These snippets are provided as guidelines for advanced users looking to customize LearnDash. For any additional help or support with these snippets, we recommend reaching out to a LearnDash Expert.

/**
 * Example event trigger handler when the page AJAX finishes and the 
 * new content is move in place. 
 * 
 * Within the args object is an element 'parent_div' to reference the 
 * outer parent div of the paged element. The args object may contain 
 * other elements in the future.
 * 
 * The folowing code is an example if scolling to the top of the parent
 * div IF it ia above the top of the current viewport.
 */
 add_action( 'wp_print_footer_scripts', function() {
	?>
	<script>
	(function($) {
		jQuery(window).on('learndash_pager_content_changed', function (e, args) {
			if ( typeof args['parent_div'] !== 'undefined') {

				var win = jQuery(window);
				var winScrollPosition = win.scrollTop();
				var objOffsetTop = jQuery(args['parent_div']).offset().top;

				if (winScrollPosition > objOffsetTop) {
					win.animate({ scrollTop: objOffsetTop }, "fast");
				}
			}	
		});
	})( jQuery );
	</script>
	<?php
}, 999);