The masonry (v3) code:
$(function msnry(){
var columns = 3,
setColumns = function() { columns = $( window ).width() > 640 ? 3 : $(window).width() > 320 ? 2 : 1; };
setColumns();
$(window).resize(setColumns);
// layout Masonry again after all images have loaded
var $container = $('#portfoliocontent').masonry();
var msnry;
$container.imagesLoaded( function(){
msnry = new Masonry( container, {
itemSelector : '.item',
columnWidth: function( containerWidth ) { return containerWidth / columns;}
});
});
My masonry container (aka my portfolio)
<div id="portfoliocontent" class="portfoliocontainer"></div>
My goal here is to hide all the divs with the class 'designshwr' which works, however the reload of masonry isn't working at all.
$('.engineeringiC').click(function(){
if($('div.item').hasClass('designshwr')){
$('div.item.designshwr').hide('fast');
$('.portfoliocontainer').masonry('reloadItems');
}
Any suggestions? I've been scratching my head for the past week at different ways to get it to work, and I still haven't gotten any luck on it :(