jQuery: dividere il contenuto di un elemento su più colonne

jQuery: dividere il contenuto di un elemento su più colonne

I CSS ci permettono facilmente di creare un layout multicolonnare ma quando questa caratteristica non è supportata dobbiamo far ricorso a jQuery.

La soluzione consiste nel dividere il numero di elementi discendenti in due sottoinsiemi e quindi includere ogni sottoinsieme in un elemento che fungerà da colonna.


var $element = $( ".post" ),
	$children = $element.find( "> *" ),
	total = $children.length,
	half = total / 2,
	$subset1 = $children.slice( 0, half - 1 ),
	$subset2 = $children.slice( half - 1 );
	
	$subset1.wrapAll( "<div class='col'></div>" );
	$subset2.wrapAll( "<div class='col'></div>" );

Torna su