Dividere una lista in colonne è semplice con jQuery.
Il seguente plugin accetta come argomento il numero di colonne in cui vogliamo dividere una lista:
$.fn.extend({
list2Columns: function( numCols ) {
var $listItems = $( this ).find( "li" );
var $listHeader = $( this );
var numListItems = $listItems.length;
var numItemsPerCol = Math.ceil( numListItems / numCols );
var currentColNum = 1, currentItemNumber = 1, returnHtml = "", i = 0;
for ( i = 1; i <= numCols; i++ ) {
$( this ).parent().append( '<ul class="column column-' + numCols + ' c-' + i + '"></ul>' );
}
$.each( $listItems, function ( j, v ) {
if ( currentItemNumber <= numItemsPerCol ) {
currentItemNumber++;
} else {
currentItemNumber = 1;
currentColNum ++;
}
$( ".c-" + currentColNum ).append( v );
});
$( this ).remove();
}
});