Riorganizza tutti gli elementi dopo aver nascosto un elemento usando jquery muron

Question

Nascondo un li e dopo averlo nascosto c'è una lacuna nell'html e voglio ricaricare la muratura e riorganizzare il contenuto con . Ho provato .masonry ('reload') ma non ho funzionato. Qualsiasi aiuto

Fiddle 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

È possibile nascondere la li-elemento e rimuovere la classe .item per riordinare gli elementi, http://jsfiddle.net/emtBX/11/

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

Answer 2

jquery muratura stessa ha un metodo chiamato "nascondi" (http://masonry.desandro.com/methods.html#hide)

usare in questo modo:

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

l'ultima muratura) chiamata (fa quello che si vuole: "ricaricare" le tessere

Answer 3

Per rispondere a Lewis commento e fornire risposta alle persone in cerca di soluzione in v3, nel metodo v3 hide non esiste più è sufficiente usare il metodo hide() di jquery e dopo aver attivato un layout di muratura. Quindi idea è per gli elementi Hidding:

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

Poi per mostrare di nuovo gli elementi nascosti:

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

Nel mio caso aggiungo a fare qualche ricerca prima di nascondere che è per questo che ho usato un ciascuna () funzione.

Stéphane