Home/ Questions/Q 7002443
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T20:55:43+00:00

I would like to create a grid on my page made up of tiny,

  • 0

I would like to create a grid on my page made up of tiny, tiny boxes – (say, 2 pixels height and width, or 2×2). I had a few thoughts on how to go about this – all of which failed in one way or another:

  1. PHP using the echo statemenet
  2. Javascript – my best option so far
  3. Manually construct the grid to fit a 800 x 800 space (would take WAY too long).

Unfortunately, even my best option was quite slow. Does anyone have a better plan for how I could create a grid made up of tiny squares in an efficient manner?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    This works for me (grid.gif is 3×3 with border, see http://stuff.drnet.at/stackoverflow/grid/ for working version):

    <html><head>
<script language="JavaScript">
function mm (e) {
  if (!e) e=window.Event;
  var o=document.getElementById('grid');
  var x=e.clientX-o.offsetLeft;
  var y=e.clientY-o.offsetTop;
  document.getElementById('coords').innerHTML=''+x+'/'+y;
}
</script>

</head>
<body onload="document.getElementById('grid').onmousemove=mm;">
<div id="grid" style="position:absolute; left:10px; top:10px; width:800px; height:600px; background: url(grid.gif) repeat left top; border:1px solid black; padding:0px; margin:0px;"></div>
<div id="coords" style="position:absolute; left:10px; top:620px;"></div>
</body>
</html>

    Tested with FF & Chrome (both on Ubuntu Lucid) only, but idea should work.

    • 0