Probé muchas librerías javascript para ordenar automáticamente elementos web dentro de containers, algunas funcionaban mal, otras eran muy pesadas o muy caras, así que me resigne a utilizar solamente CSS para ordenar de una manera algo sosa, como lo pueden ver en mi sitio poweredbyrss.com.ar , ayer decidí hacer algo mas automático y que quede mas ordenada y parejo... para eso hice esta librería que la llame Linx-UI.
Linx-UI
Linx-UI es una pequeña librería para javascript que automatiza el ordenamiento de varios elementos web dentro de un contenedor. Divide columnas o filas en tamaños iguales para que quede todo mas parejo. Ademas tiene un soporte para temas muy fácil de usar.
Uso:
El uso es muy sencillo, solo agregamos esto a la cabecera de nuestra pagina web:
<link rel="stylesheet" type="text/css" href="linx-ui-web.css" />
<script src="linx-ui-web.js"></script>
Y ahora llamamos a la función “linx” para ordenar el contenido, ejemplo:
<body onload="linx('myContainer',10,'zoomy-sky',4,'portrait')">
<div id="myContainer">
<div>1</div><div>2</div>
<div>3</div><div>4</div>
<div>5</div><div>6</div>
<div>7</div><div>8</div>
</div>
</body>
La función linx esta compuesta asi:
linx(IDcontenedor,TamañoDeMargenes,Tema,NumeroDeColumnas,Orientacion)
IDcontenedor: Id del elemento que contiene los elementos a ordenar.
TamañoDeMargenes: Tamaño de los margenes de todos los elementos en pixeles(solo numero enteros).
Tema: el nombre del tema. Pueden ser: 'zoomy-sky', 'zoomy-dark', 'metro-red', 'metro-green', 'firefox-orange', 'opera-white', 'chrome-blue', 'crystal-blue', 'circle-pink'.
NumeroDeColumnas: numero entero de la cantidad de columnas o filas según orientación.
Orientacion: puede ser 'portrait'(portaretrato) o 'landscape'(apaisado).
Demo
El demo es una pagina que muestra los últimos paquetes para linux actualizados.
Descargar
Licencia: BSD(hagan lo que quieran con la librería, me chupa un huevo).
Espero que les sirva. Y si alguien le interesa unirse a mi blog Poweredbylinux.es me manda un MP.