Grid Lines (jQuery Plugin)

While improving SSG (Style Sheet Generation) i made this plugin hopping it might be usefull for some webdesigners to get better messures.

There is a left upper menu with 3 inputs (type numbers)

first one for drawing methodes (4 types)
second to add Horizontal lines
third to add vertical lines

You can see a demo here how it looks like Grid Lines Demo

Installing Grid Lines

Download grid_lines.js

Create a reference:

<script src="grid_lines.js"></script>

Add following line in your site:

<script>
$.grid_lines();
</script>

Options

store // true/false for saving last settings
borderStyle // css border
hideKey // KeyCode to hide grid lines, its set to 72 (for Key H) as default
// you can also set to FALSE and use click function to hide or show: onClick="$.grid_lines.gridButton();"
widthReduceBy // reduce width if need
heightReduceBy // reduce height if needed 
isHidden // true/false to show or hide grid lines at first start. Its also stored If store options is set to TRUE

An example with options

$.grid_lines({
isHidden: true,
borderStyle: '1px solid blue',
widthReduceBy: 19
});

Have fun