Grid Overlay Bookmarklet
Just a quick note to share my version of Andy Budd’s Layout Grid Bookmarklet.
Grid Translucent Centered
);void(myBody=document.getElementsByTagName(%27body%27)[0]);if(myDiv!=null){void(myBody.removeChild(myDiv));}else{void(myDiv=document.createElement%20(%27div%27));void(myDiv.id=%27_grid_div_mrb%27);void(myDiv.style.background=%27url(https://trippledoubleyou.subtlegradient.com/tools/layoutgrid-centered_translucent.png)%20repeat%20top%20center%27);/*@cc_onmyDiv.style.background=%27none%27;myDiv.style.filter=%27progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\%27https://trippledoubleyou.subtlegradient.com/tools/layoutgrid-centered_translucent.png\%27,%20sizingMethod=\%27image\%27)%27;@*/void(myDiv.style.position=%27absolute%27);void(myDiv.style.width=%27100%%27);void(myDiv.style.height=myBody.offsetHeight+%27px%27);void(myDiv.style.top=%270%27);void(myDiv.style.left=%270%27);void(myDiv.onclick=function(){void(myBody.removeChild(myDiv));});void(myBody.appendChild(myDiv));}){kind=link}
Grid Translucent Left-Aligned
);void(myBody=document.getElementsByTagName(%27body%27)[0]);if(myDiv!=null){void(myBody.removeChild(myDiv));}else{void(myDiv=document.createElement%20(%27div%27));void(myDiv.id=%27_grid_div_mrb%27);void(myDiv.style.background=%27url(https://trippledoubleyou.subtlegradient.com/tools/layoutgrid-centered_translucent.png)%20repeat%20top%20left%27);/*@cc_onmyDiv.style.background=%27none%27;myDiv.style.filter=%27progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\%27https://trippledoubleyou.subtlegradient.com/tools/layoutgrid-centered_translucent.png\%27,%20sizingMethod=\%27image\%27)%27;@*/void(myDiv.style.position=%27absolute%27);void(myDiv.style.width=%27100%%27);void(myDiv.style.height=myBody.offsetHeight+%27px%27);void(myDiv.style.top=%270%27);void(myDiv.style.left=%270%27);void(myDiv.onclick=function(){void(myBody.removeChild(myDiv));});void(myBody.appendChild(myDiv));}){kind=link}
This version uses a translucent png.
Share and enjoy!
UPDATE: New scripts for all browsers. Now you can also click the grid on the page to remove it.
Just a quick note to share my version of Andy Budd’s Layout Grid Bookmarklet.
Grid Translucent Centered
Grid Translucent Left-Aligned
This version uses a translucent png.
Share and enjoy!
UPDATE: New scripts for all browsers. Now you can also click the grid on the page to remove it.