From 7064cd444dcd4a42582a3f0b530a2a4703e1b03e Mon Sep 17 00:00:00 2001 From: claudiuvertistudio Date: Fri, 26 Aug 2016 15:42:16 +0300 Subject: [PATCH 1/2] #38 Issue with Jetpack Infinite scroll --- js/masonry-init.js | 53 ++++++++++++++++++++++++++++++++++++---------- 1 file changed, 42 insertions(+), 11 deletions(-) diff --git a/js/masonry-init.js b/js/masonry-init.js index 90f1982..8535677 100644 --- a/js/masonry-init.js +++ b/js/masonry-init.js @@ -1,15 +1,46 @@ //Masonry init jQuery(function($) { - var $container = $('.grid-layout'); - $container.imagesLoaded( function() { - $container.masonry({ - itemSelector: '.hentry', - isAnimated: true, - animationOptions: { - duration: 300, - easing: 'linear', - } - }); - }); + + var $container; + + function nsc_trigger_masonry() { + // don't proceed if $grid has not been selected + if ( !$container ) { + return; + } + // init Masonry + $container.imagesLoaded( function() { + $container.masonry({ + itemSelector: '.hentry', + isAnimated: true, + animationOptions: { + duration: 300, + easing: 'linear', + } + }); + }); + } + + $(window).load(function(){ + $container = $('.grid-layout'); // this is the grid container + + nsc_trigger_masonry(); + + // Triggers re-layout on infinite scroll + $( document.body ).on( 'post-load', function () { + + // I removed the infinite_count code + var $selector = $('.infinite-wrap'); + var $elements = $selector.find('.hentry'); + + /* here is the idea which is to catch the selector whether it contain element or not, if it's move it to the masonry grid. */ + if( $selector.children().length > 0 ) { + $container.append( $elements ).masonry( 'appended', $elements, true ); + nsc_trigger_masonry(); + } + + }); + }); + }); \ No newline at end of file From 091886ed884811ab9294fde9f9e39b9c6510409f Mon Sep 17 00:00:00 2001 From: Rodica-Elena Andronache Date: Fri, 26 Aug 2016 16:08:37 +0300 Subject: [PATCH 2/2] Update style.css --- style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/style.css b/style.css index b918e85..bfe0e7e 100644 --- a/style.css +++ b/style.css @@ -4,7 +4,7 @@ Theme URI: http://themeisle.com/themes/oblique Author: Themeisle Author URI: http://themeisle.com/ Description: Oblique is a creative masonry theme that works great for fashion or general bloggers. Amongst the features you will find a a parallax header image, full color control with unlimited color variations, easy access to all Google Fonts, responsive design etc. -Version: 1.12 +Version: 1.13 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: oblique