砌體無限滾動動畫不光滑

Question

我該如何解決這個問題，我的砌體無限動畫新的加載項更好。現在，它會直接顯示，沒有一個流暢的動畫效果：

function(newElements) { 
    // hide new items while they are loading 
    var $newElems = $(newElements).css({ opacity: 0 }); 
    // ensure that images load before adding to masonry layout 
    $newElems.imagesLoaded(function(){ 
     // show elems now they're ready 
     $newElems.animate({ opacity: 1 }); 

     $container.masonry('appended', $newElems, true); 
    }); 
    } 

Answer 1

試試這個

function(newElements) { 
// hide new items while they are loading 
var $newElems = $(newElements).css({ opacity: 0 }); 
// ensure that images load before adding to masonry layout 
$newElems.imagesLoaded(function(){ 
    // show elems now they're ready 
    $newElems.css({ opacity: 1 }); 

    $container.masonry('appended', $newElems, true); 
}); 
} 

或者這可能工作好一點。 （我假設你正在使用砌體3？）。

function(newElements) { 
// hide new items while they are loading 
var $newElems = $(newElements).hide(); 
// ensure that images load before adding to masonry layout 
$newElems.imagesLoaded(function(){ 
    // show elems now they're ready 
    $newElems.fadeIn(); 
    $container.masonry('appended', $newElems, true); 
}); 
}