jquery - Show/hide callback with jQuery Masonry?

Question

I want to hide my content until Masonry has had a chance to style it (to prevent the dreaded flash of unstyled content), and then hide the loader gif . Here is a code snippet:

var $container = $('#deals');

$(window).load(function(){    
    $container.masonry({
        itemSelector : '.deals-wrapper',
        columnWidth : 0,
        isFitWidth: true
    });
},
function() {
    $container.show();
    $('#loader').hide();
});

However, I notice that when .show() is called, Masonry hasn't been applied to the content. I know in this question, the creator of Masonry suggested that there isn't good support for Masonry callbacks right now. Has anyone come up with a decent workaround?

Thanks!

Answer 1

也许你可以使用 css 来隐藏元素，只要它加载。还有这个.imagesLoaded()功能。您可以在我最近的问题中看到一个示例。