WebAppers

/ best free open source web resources /

Shopify

Griddy – Customizable Grid Overlay jQuery Plugin

Posted · Category: BSD License, GPL License, MIT License, Tools

Griddy is a small JQuery plugin thats creates a simple, customizable grid overlay on top of any element. It can also calculate row heights and column widths automatically based on the number of rows/columns and gutter space. There are few options, including: rows, row height, row gutter, columns, column height, column width, color and opacity.

All of the styling is done inline to avoid linking to an external CSS file or having to use images. The numbers on top are column widths, the numbers running along the left side are row heights. You can also look at 960.gs grid overlay which does the similar thing.

griddy

Requirements: jQuery Framework
Demo:
http://devgrow.com/griddy-overlay/
License: MIT, BSD, GPL License

6 Comments
  • http://1click.at Michael Pehl

    Thanks for mentioning :)

  • http://www.badlydrawntoy.com/ badlyDrawnToy

    Thanks for mentioning my jQuery plugin. I actually updated it a year ago to run as a bookmarklet. It automatically inserts jQuery on any site at runtime

    http://www.badlydrawntoy.com/2009/04/23/grid960-a-grid-overlay-bookmarklet-for-960gs/

  • http://devgrow.com/ DevGrow

    Thanks for mentioning Griddy, I appreciate it!

  • http://albertverpeten.be/ Gevelrenovatie

    That’s a good link, thanks for sharing!

  • http://seoshneg.com/ Seoshneg

    Thanks for mentioning

  • http://websitecenter.ca/clients Iouri Goussev

    There is also a Firefox plugin GridFox. Nice plugin to use with blueprint/compass.

Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons