Skip to content

Instantly share code, notes, and snippets.

@randito
Forked from webxl/grid.js
Created October 10, 2011 16:20
Show Gist options
  • Save randito/1275721 to your computer and use it in GitHub Desktop.
Save randito/1275721 to your computer and use it in GitHub Desktop.
CSS prototyping bookmarklet
javascript:(function(){s1=document.createTextNode('body::before { content:""; position:fixed; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxEAAAsRAX9kX5EAAAAZdEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjVJivzgAAAAyUlEQVRoQ%2B2abQqAIBBEPW1X6CzdqTv1RUFIipi2o72gPyXV7uybKci5wDZM8xI6dz%2Buvs6pP2Dq81GI2qiiiJkiOzQ97EGHTXUF9XUwYsaI2o1LjyqjpaYwiqDI2YFs2HtI9Wjx2Z0R%2B1ADdmB%2FC7taB0uzCSNqCqOImSIkeyW7xLXMZvqjdzJcS01hFEGRSnbe3miR7JVGgWRXcxkUQRFgj%2F8Y8htGtkJHL%2FvGaGtKd6bU9Z4C%2FCiEZDeCPahIa%2FbbDSNX433mVkIrV5rTnhDyAAAAAElFTkSuQmCC) 50% 0; z-index:1; top:0; right:0; bottom:0; left:0; opacity:.3; pointer-events:none; } * { -webkit-user-modify: read-write; word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; } a { -webkit-user-modify: initial; }');s2=document.createTextNode('#a1_z { background-color: #fff; float: left; position: absolute; z-index:2; padding: 3px; border: 1px solid; }');css=document.createElement('style');css.type='text/css';css.media='screen';document.getElementsByTagName('head')[0].appendChild(css);css.appendChild(s1);css.appendChild(s2);div=document.createElement('div');div.id='a1_z';input=document.createElement('input');input.type='checkbox';input.checked='checked';label=document.createElement('label');label.innerHTML=" Toggle Grid ";div.appendChild(input);div.appendChild(label);body=document.getElementsByTagName('body')[0];first=body.firstChild;body.insertBefore(div,first);input.onclick=function(){if(this.checked){css.appendChild(s1);}else{css.removeChild(s1);}}})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment