jquery Isotopen-Option für die automatischen Höhen auf Element

Question

So bin ich mit dem Isotop masonry Layout

$('section').isotope({itemSelector:'article',layoutMode:'masonry',transformsEnabled: false, animationEngine: 'jquery',masonry:{columnWidth:8}});

Das Problem ist, dass wenn ich die Höhe nicht für die article in CSS festgelegt, das Layout doesn Es sieht nicht gut aus, dass sich die Elemente überschneiden und so, aber ich kann keine feste Höhe für die Elemente festlegen, da es sich um Blogposts handelt, die sich in der Größe ändern können. Habt ihr irgendwelche Tipps, wie das gelöst werden kann?

Answer 1

Problem gelöst, müssen Sie rufen $(window).load instead of $(document).ready(

Answer 2

var $container = $('#container').imagesLoaded(function() { 
    $container.isotope({ 
    // options 
    }); 
}); 

Siehe Isotope - imagesLoaded

Answer 3

Dies geschah, weil Isotop wissen doen't Ihre Bildgrößen vor Belastung. Der beste Weg, dies zu tun, ist eine Ladeanzeige (möglicherweise mit imageLoaded Plugin), um die Bilder zu laden und dann ein Einfügen oder Anhängen mit Isotop durchzuführen. Sie haben eine reibungslose Navigation und eine schnellere Lade-Site als mit $ (window) .load().