Urielmania
“El Mundo de Uriel… Pero la voz de todos”
gridster.js, es un plugin jQuery para hacer tus layouts draganddropeables, y que quiere decir esto pues que permite la construcción de diseños intuitivos que pueden arrastrarse a partir de elementos que abarcan varias columnas.
Sencilla de utilizar; se puede incluso agregar y quitar elementos de la grid dinámicamente con apenas cuatro métodos y una docena de atributos bien documentados , ademas cuenta con licencia MIT. Fue Desarrollada y liberada por la gente de Ducksboard en Github.
Como utilizar esta libreria:
Include dependencies
Gridster is currently written as a jQuery plugin, so you need to include it in the head of the document. Download the latest release at jQuery.
<script type=»text/javascript» src=»libs/jquery.js»></script><script type=»text/javascript» src=»jquery.gridster.js»></script>HTML Structure
Class names and tags are customizable, gridster only cares about data attributes. Use a structure like this:
<div class=»gridster»><ul><li data-row=»1″ data-col=»1″ data-sizex=»1″ data-sizey=»1″></li><li data-row=»2″ data-col=»1″ data-sizex=»1″ data-sizey=»1″></li><li data-row=»3″ data-col=»1″ data-sizex=»1″ data-sizey=»1″></li><li data-row=»1″ data-col=»2″ data-sizex=»2″ data-sizey=»1″></li><li data-row=»2″ data-col=»2″ data-sizex=»2″ data-sizey=»2″></li><li data-row=»1″ data-col=»4″ data-sizex=»1″ data-sizey=»1″></li><li data-row=»2″ data-col=»4″ data-sizex=»2″ data-sizey=»1″></li><li data-row=»3″ data-col=»4″ data-sizex=»1″ data-sizey=»1″></li><li data-row=»1″ data-col=»5″ data-sizex=»1″ data-sizey=»1″></li><li data-row=»3″ data-col=»5″ data-sizex=»1″ data-sizey=»1″></li><li data-row=»1″ data-col=»6″ data-sizex=»1″ data-sizey=»1″></li><li data-row=»2″ data-col=»6″ data-sizex=»1″ data-sizey=»2″></li></ul></div>
Lo vi en http://develop.sitescm.com/
Para descargarte gridster.js: gridster.net
Acerca del Autor
