Listas UL OL en columnas con jQuery

Uno de los elementos más utilizados en el diseño web son las listas, las mismas se pueden estilizar muy fácilmente utilizando CSS, basta con aplicar algunos estilos para que podamos obtener un resultado más que aceptable.

Uno de los grandes problemas a la hora de trabajar con listas tanto ul o ol es de utilizar una disposición en columnas, que si bien se puede realizar sin problemas puede dar algunos dolores de cabeza, principalmente con el tema de la compatibilidad con los distintos navegadores. Pero esto puede ser algo del pasado gracias a Easy List Splitter, un plugin jQuery para crear columnas a partir de listas.

En la sección de demostración hay más ejemplo, el siguiente es uno de ellos:

La implementación es sumamente simple y muy limpia, que creo el aspecto más importante, por un lado vamos a tener la lista común y corriente:

<ul class="my-list">
	<li><a href="#">Lorem ipsum 1</a></li>
	<li><a href="#">Donec pede 2</a></li>
	<li><a href="#">Fringilla vel 3</a></li>
	<li><a href="#">Eget arcu 4</a></li>
	<li><a href="#">In enim 5</a></li>
	<li><a href="#">Lorem farem 6</a></li>
</ul>

Y finalmente hacemos la llamada al código jQuery indicando la cantidad de columnas:

$('.my-list').easyListSplitter({ colNumber: 3 });

Un plugin interesante y que merece la pena conocer 😀

Web: Easy List Splitter