CODEWITHSUNDEEP
jquerycallbackloadjquery-masonry
Paul Erdos
Paul Erdos

Reputation: 1375

Show/hide callback with jQuery Masonry?

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!

Upvotes: 3

Views: 1010

Answers (1)

some_guy
some_guy

Reputation: 206

Maybe you could use css to hide the element as long as its loading. Also there is the .imagesLoaded() function. You can see an example in my recent Question.

Upvotes: 2

Related Questions