Snippets: Total Filter Grid Scroll To Items on Filter

This snippet will make it so when a filter item is clicked it scrolls down to the items. This can be useful on mobile if you have a ton of filter links. As you can see by default it is only applied on screen sizes equal to or smaller than 676 pixels, simply alter the 767 value to target the desired screen width at which you want this function to take place.

add_action( 'wp_footer', function() { ?>
	<script>
		( function( $ ) {
			'use strict';
			$( document ).on( 'ready', function() {
				if ( $( window ).width() <= 767 ) {
					var $filters = $( '.vcex-filter-links' )
					$filters.each( function() {
						var $this  = $( this );
						var $links = $this.find( 'a' );
						var $grid  = $this.next( '.vcex-isotope-grid' );
						$links.on( 'click', function() {
							$( 'html, body' ).animate( {
								scrollTop: $grid.offset().top
							}, 1000 );
						} );
					} );
				}
			} );
		} ( jQuery ) );
	</script>
<?php } );
All PHP snippets should be added via a child theme's functions.php file.