960 Gridder, layout websites with ease
960 Gridder is an excellent tool for any web developer/ designer that wants to easily align, match and/or lay out websites.
960 Gridder is cross-browser compliant and works well in Internet Explorer 6/7/8, Firefox 2/3 and Chrome. Safari 4 Beta and Opera 9 is also working as expected and it should work in Safari 2.x-3.x also.
960 Gridder is built upon the very famous JavaScript framework jQuery. 960 Gridder will automatically identify if jQuery is present at the website and if it is not, it will include it. However, 960 Gridder isn’t affiliated with the jQuery authors at all.
It injects your website of choice and you can then work with this tool to help you out with whichever layout/design task you find it useful for.
By default, it is set to work with 12 columns, 60 pixel wide columns with a 10 pixel spacer left and right of the column, making it a 20 pixel wide gutter (which actually is the ones this gridder renders).
Implementation
use the code below to automatically enable the grid on your website.
<head>
<script type="text/javascript">
// Insert optional override object before the function
createGridder = function() {
document.body.appendChild(
document.createElement('script'))
.src='http://path-to/960.gridder.js';
}
</script>
</head>
<body onload="createGridder()">
Demo: http://gridder.andreehansson.se/implemented
Download: http://gridder.andreehansson.se/releases/1.3.1/960.gridder.js
0
510
