- Author:
- Vladimir Carrer
- Twitter:
- @
- GitHub:
- Facebook:
- Google+:
- +
- Reddit:
- /r/
- Pouet:
- Website:
- vcarrer.com
- Compo:
- classic
- Demo link:
- https://js1k.com/2010-first/demo/726
- Shortlink:
- https://js1k.com/726
- Blog post:
- please update here!
- Bytes:
- 605
- Chars:
- 605
- Submission
var a=document.getElementById("c");a.style.cssText="left:0;top:"+document.documentElement.scrollTop+"px; z-index:100000; position:absolute;";a.width=window.innerWidth;a.height=window.innerHeight;var b=a.getContext("2d"),c=window.innerWidth,d=window.window.innerHeight;b.font="bold 15px sans-serif";b.strokeStyle="rgba(245, 197, 196, 0.5)";b.beginPath();for(var e=0;e<c;e+=10){b.moveTo(e,0);b.lineTo(e,c)}for(e=0;e<c;e+=100){b.moveTo(e,0);b.lineTo(e,c);b.fillText(e,e+4,15)} for(var f=0;f<d;f+=100){b.moveTo(0,f);b.lineTo(c,f);b.fillText(f,10,f-4)}for(f=0;f<d;f+=10){b.moveTo(0,f);b.lineTo(c,f)}b.stroke();
- Description
- Simply puts the grid around the visual browser surface divided by 100px.
- Base64 encoded
dmFyIGE9ZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoImMiKTthLnN0eWxlLmNzc1RleHQ9ImxlZnQ6MDt0b3A6Iitkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQuc2Nyb2xsVG9wKyJweDsgei1pbmRleDoxMDAwMDA7IHBvc2l0aW9uOmFic29sdXRlOyI7YS53aWR0aD13aW5kb3cuaW5uZXJXaWR0aDthLmhlaWdodD13aW5kb3cuaW5uZXJIZWlnaHQ7dmFyIGI9YS5nZXRDb250ZXh0KCIyZCIpLGM9d2luZG93LmlubmVyV2lkdGgsZD13aW5kb3cud2luZG93LmlubmVySGVpZ2h0O2IuZm9udD0iYm9sZCAxNXB4IHNhbnMtc2VyaWYiO2Iuc3Ryb2tlU3R5bGU9InJnYmEoMjQ1LCAxOTcsIDE5NiwgMC41KSI7Yi5iZWdpblBhdGgoKTtmb3IodmFyIGU9MDtlPGM7ZSs9MTApe2IubW92ZVRvKGUsMCk7Yi5saW5lVG8oZSxjKX1mb3IoZT0wO2U8YztlKz0xMDApe2IubW92ZVRvKGUsMCk7Yi5saW5lVG8oZSxjKTtiLmZpbGxUZXh0KGUsZSs0LDE1KX0gZm9yKHZhciBmPTA7ZjxkO2YrPTEwMCl7Yi5tb3ZlVG8oMCxmKTtiLmxpbmVUbyhjLGYpO2IuZmlsbFRleHQoZiwxMCxmLTQpfWZvcihmPTA7ZjxkO2YrPTEwKXtiLm1vdmVUbygwLGYpO2IubGluZVRvKGMsZil9Yi5zdHJva2UoKTs=
- Original source
function drawGrid(){
var canvas = document.getElementById('c');
var t = document.documentElement.scrollTop;
canvas.style.cssText = "left:0;top:"+t+"px; z-index:100000; position:absolute;";
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
var ctx = canvas.getContext('2d');
var a = window.innerWidth;
var b = window.window.innerHeight;
ctx.font = "bold 15px sans-serif";
ctx.strokeStyle = "rgba(245, 197, 196, 0.5)";
ctx.beginPath();
for (var x = 0; x < a; x += 10) {
ctx.moveTo(x, 0);
ctx.lineTo(x, a);
}
for (var x = 0; x < a; x += 100) {
ctx.moveTo(x, 0);
ctx.lineTo(x, a);
ctx.fillText(x, x+4, 15);
}
for (var y = 0; y < b; y += 100) {
ctx.moveTo(0, y);
ctx.lineTo(a, y);
ctx.fillText(y, 10, y-4);
}
for (var y = 0; y < b; y += 10) {
ctx.moveTo(0, y);
ctx.lineTo(a, y);
}
ctx.stroke();
}
drawGrid();
