Simple jQuery Plugin for Dynamic Grid Layout - Grid.js

Grid.js is a lightweight and fast jquery plugin that allows you to easily create a Dynamic Grid Layout for your website. The elements in the grid will be automatically arranged when the size of window is changed.

How to use it:

1. Include jQuery library and Grid.js

<script src='http://code.jquery.com/jquery-1.9.1.min.js'></script> 
<script src='jquery.grid.js'></script> 

2. Markup

<ul id="grid">
</ul> 

3. Call the plugin with options

<script>
 var createGrid = (function() {
     var i = 80;
     while (--i) {
         var li = document.createElement('li'),
         w = 96 * (parseInt(Math.random() * 2) + 1) - 12,
         h = 60 * (parseInt(Math.random() * 5) + 1);
         li.innerHTML = i;
         li.className = 'item';
         $(li).css({
             width: w,
             height: h,
             lineHeight: h + 'px'
    }).appendTo('#grid');

}
    })();
    $('#grid').grid({animate: true});
</script>

3. DONE

---

This awesome jQuery plugin is developed by unknown. For more Advanced Usages, please check the demo page or visit the official website.