Tag Archives: jQuery Masonry

jQuery Isotope – Remove Isotope items without triggering relayout

Recently i have been working on a frontend layout task. The two jQuery plugins, Isotope and Masonry written by David DeSandro, are wonderful for laying your content in neat order. Isotope is an advanced version of Masonry and provides more powerful features. If you are new to both, you could try Masonry first.

Let’s back to the topic today. Both Isotope and Masonry provide the remove() function to withdraw the item from the dynamic layout. If you are using Masonry, the layout does not rearrange the items after the removal. On the other hand, the more powerful Isotope will relayout after the items are deleted. Actually this is a more desirable feature but this time i just want to delete those unwanted items without triggering the relayout.
Continue reading jQuery Isotope – Remove Isotope items without triggering relayout

jQuery Masonry – Append items does not work?

We could append items on the Masonry container using the appended method.

var $boxes = $('<div class="box"/><div class="box"/><div class="box"/>');
$('#container').append( $boxes ).masonry( 'appended', $boxes );

 

Please note that in the above example, we have to wrap the new boxes with the jQuery object. This is because the .masonry() call expects an jQuery object in the 2nd parameter.

Done =)

Reference: