hashgrid for Mootools
You may have seen the Analog.coop site recently and found some of the easter eggs, like the grid hot keys. I loved the concept, and made a mental note to spend some time reverse engineering/rebuilding it for my own uses. Well it just so happens that the guys at Analog have released the #grid on Github, which is great because it made it easier for me to adapt the code and do some small improvements.
I’ve ported #grid to use Mootools instead of jQuery. I’ve also made column generation not use images. Instead column guides are generated programatically with using a few options located at the top of the file.
- var GRID_OPTIONS = {
- width: 980, //width of your layout.
- gutters: 20, //space between each column
- columns: 6 // Number of columns you want on your grid.
- };
The configuration options allow much easier and image free grid creation. So if you’re a mootools fan and love grid designs like I do, check out my forked repository
This may be a really silly question, but what’s the benefit using the hashgrid? Is it just a neat tool to help line up stuff on your site or am I missing something else?
In any case, nice job on the fork. =)
Nick on 12/31/09
Happy New Year, Mark!
Thanks for making a version of hashgrid for MooTools and sharing it – nice work, sir! I like what you’ve done with the vertical columns. I’ll be making some improvements to hashgrid shortly, including making it a bit more configurable.
Jon Gibbins on 1/6/10
Hi Jon, thanks for dropping by, glad that you liked the changes. I’ll do my best to keep the mootools hash grid in sync with any changes you make :)
mark story on 1/6/10