Minimal Metro Style Tiled Grid Plugin With jQuery - jqgrids

File Size: 13.6 KB
Views Total: 4447
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimal Metro Style Tiled Grid Plugin With jQuery - jqgrids

jqgrids is a super tiny (~2kb) jQuery plugin that helps you generate a Metro style (Microsoft's Modern UI) tiled grid layout with custom background images / icons.

How to use it:

1. Include the jQuery jqgrids plugin's JavaScript and CSS files after you've included jQuery library.

<link href="css/jqgrids.css" rel="stylesheet">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="js/jqgrids.js"></script>

2. Create a container for the tiled grid.

<div id="my-layout" class="metro-panel"></div>

3. Add items with custom text, images, links to the grid.

// $.AddMetroSimpleButton(id, theme, image, text, link)
$("#my-layout").AddMetroSimpleButton('bt1', 'metro-verde', 'profile.png', 'Profile', '#');

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