jQuery Plugin for Horizontal Spacing Layout - gridem

File Size: 6.11KB
Views Total: 1818
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin for Horizontal Spacing Layout - gridem

gridem is a jQuery plugin that automatically and evenly add horizontal spacing to a list of items across multiple rows on a page. 

Basic Usage:

1.  Download and include the latest jQuery library and jQuery gridem plugin on your web page

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

2. Markup Html Structure

<ul class="small-grid">
<li>Your CONTENT</li>
<li>...</li>
<li>...</li>
<li>...</li>
...
</ul>

3. Initialize the plugin with options

$(window).load(function() {
  $('.small-grid').each(function() {
    $(this).gridEm();
});

4. More Options

$(window).load(function() {
  $('.small-grid').each(function() {
    $(this).gridEm({
      minMargin: 10, // Minimum margin between items (in pixels) (default: 10)
      maxMargin: 50 //  Maximum margin between items (in pixels) (default: 100)
    });
});

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