2013-04-27 87 views
-1

我正在製作一個使用jquery-masonry的wordpress主題,但對於我的生活我無法弄清楚如何在isAnimatedFromBottom中使用append方法。以下是我目前使用的代碼。我試圖讓這個與jetpack無限滾動工作。jQuery砌體IsAnimatedFromBottom in Wordpress

任何洞察力或幫助非常感謝。

jQuery(document).ready(function($) { 
var $container = $('#content'); 

$container.imagesLoaded(function(){ 
    $container.masonry({ 
     itemSelector: '.post', 
     isAnimated: true, 
     animationOptions: { 
      duration: 300, 
      easing: 'linear', 
      queue: false 
     } 
    }); 
}); 

});

回答

0

如果您希望新元素出現在底部而不是出現左上角然後飛入位置。 您應該爲附加方法使用isAnimatedFromBottom標誌。例如

var isAnimatedFromBottom = true; 
.masonry('appended', $content, isAnimatedFromBottom); 

下面的代碼是用於infinitescroll一個例子..

$container.infinitescroll({ 
    navSelector : '#page-nav', // selector for the paged navigation 
    nextSelector : '#page-nav a', // selector for the NEXT link (to page 2) 
    itemSelector : '.box',  // selector for all items you'll retrieve 
    loading: { 
     finishedMsg: 'No more pages to load.', 
     img: 'http://i.imgur.com/6RMhx.gif' 
    } 
    }, 
    // trigger Masonry as a callback 
    function(newElements) { 
    var $newElems = $(newElements); 
    // ensure that images load before adding to masonry layout 
    $newElems.imagesLoaded(function(){ 
     $container.masonry('appended', $newElems, true); 
    }); 
    } 
);