I'm trying to disable jQuery masonry for certain states of a page on my site but can't seem to find a way to do it. Do you know how I could do this? Thanks.
To disable any control with jQuery pass true as the second argument to the .prop () method. There is an input control and a button. On the button click event I will disable the input control. Here I have a disabled input control which I will enable on the button click. Sometimes you want to keep the submit button of a form disabled.
Get the Masonry instance from a jQuery object. Masonry instances are useful to access Masonry properties. Get the Masonry instance via its element. Masonry.data () is useful for getting the Masonry instance in JavaScript, after it has been initalized in HTML.
Masonry will lay out item elements around stamped elements. Set itemSelector so that stamps do not get used as layout items. Un-stamps elements in the layout, so that Masonry will no longer layout item elements around them. See demo above. Adds and lays out newly appended item elements to the end of the layout.
The most obvious is to use jQuery, which you can turn on by calling isAnimated: true when calling on Masonry. This does the job, but jQuery animation relies on DOM manipulation and having several large bricks can slow down the animation performance and make the experience feel sluggish.
Here is the list of methods http://desandro.github.io/masonry/docs/methods.html#content
Assuming your Masonry container ID is #masonry
$('#masonry').masonry( 'destroy' );
I used @kaverzniy's answer but wrapped it in
var container = $('#container'); // or whatever your container is
if(container.masonry()) {
$('#masonry').masonry( 'destroy' );
}
to avoid calling methods on masonry prior to initialization (in case it hadn't been initialized yet).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With