Reorganizar todos los elementos después de ocultar un elemento usando mampostería de jquery

Question

Oculto un li y después de ocultarlo, queda un espacio en el html y quiero recargar la mampostería y volver a organizar los contenidos. Intenté .masonry ('reload') pero no funcionó. Cualquier ayuda

violín http://jsfiddle.net/emtBX/1/

JS

$(document).ready(function(){ 
       $('#container').masonry({ 
       // options 
       itemSelector : '.item', 
       columnWidth : 240, 

       isAnimated: true, 
        animationOptions: { 
        duration: 750, 
        easing: 'linear', 
        queue: false 
        } 
       }); 

       $('#butn1').click(function() { 

        $('#container ul li').eq(2).hide(); 
        $('#container').masonry('reload'); 

       }); 
      }); 

Answer 1

Puede ocultar el elemento li y retire la clase .item para reordenar los elementos, en sí mampostería http://jsfiddle.net/emtBX/11/

$('#container ul li').eq(2) 
    .css({'visibility': 'hidden', 'display': 'none'}) 
    .removeClass("item masonry-brick"); 

Answer 2

jQuery tiene un método llamado "ocultar" (http://masonry.desandro.com/methods.html#hide)

utilizar de esta manera:

$('#container').masonry('hide', $('#container ul li').eq(2)).masonry(); 

el último de mampostería() llamada hace lo que quiere: "recargar" las baldosas

Answer 3

Para responder comentario Lewis y dar respuesta a las personas que buscan una solución en la versión 3, en el método ocultar v3 ya no existe, solo tienes que usar el método hide() de jquery y después de activar un diseño de mampostería. Así idea es que los elementos hidding:

$('.something-to-hide').each(function(){ 
    $(this).hide(); 
}); 
$('.grid').masonry('layout'); //we assume grid is your class use to masonry container. 

Entonces para mostrar devolver los elementos ocultos:

$('.class-for-all-elements').show() 
$('.grid').masonry('layout'); 

En mi caso puedo añadir a hacer un poco de búsqueda antes de ocultar por eso he usado una cada uno () función.

Stéphane