jQuery.nnmGrid

Diagonal grid layout plugin for jQuery

Usage example

HTML

<ul id="container"> <li class="item"><a href="#01"><img src="img/btn01.png" alt=""></a></li> <li class="item"><a href="#02"><img src="img/btn02.png" alt=""></a></li> <li class="item"><span><img src="img/btn03.png" alt=""></span></li> </ul> 

CSS

#container {   width: 630px; } 

JavaScript

// DOM Ready jQuery(function($){   var $container = $( '#container' ).nnmGrid({     gap: 5     isHover: 'is-hover'     itemWidth: 150,     itemHeight: 150,     itemSelector: '.item',     onHover: function(){},     onClick: function(){}   });      // Update   $container.width( $(window).width() );   $container.nnmGrid( 'update' ); }); 

Demo

http://nbnote.github.io/jquery-nnmgrid/