A virtual ruler! It's a useful tool for web designers and maybe for others too Simply click the grid in two places to measure the distance between the points (in pixels). To remove the points, click again. You can create straight lines with Shift key. You have to right click this widget to close it, because it covers the whole screen.
A simpler version of the ruler is included for Linux users, because widgets on Linux have problems with transparency. It will be detected and enabled automatically if you don't use Windows or Mac.
I'd love to see better Linux version too. Oh and transparency doesn't work on windows 98 as well, all I'm able to see is black background and the ruler, though it works fine.
- It seems to be quite laggy, I assume that this is because you are using canvas and are clearing the entire rectangle instead of just the line. To clear only the line more efficiently you should stroke over it again with a wider line and use the javascript:
ctx.globalCompositeOperation="destination-out";
- Place the points using onmousedown instead of onclick to make it more responsive to the click.
VERSION 1.5: Now a simpler version of the ruler is included for Linux users (widgets on Linux have problems with transparency). It will be detected and enabled automaticly if you don't use Windows or Mac.
発言者 Ramunas, # 2006/07/17 11:22:56
発言者 grafio, # 2006/07/14 13:35:38
Maybe add two rulers, one vertical and one horizontal.
And also it is important to be able to MOVE the ruler (ok, my window manager allows me to use alt+mouse).
Maybe even the not-linux versions could use this "simplified" interface (by an option)
Also, drawing a ruler with numbers on them might be useful.
発言者 CrazyTerabyte, # 2006/07/12 22:24:02
発言者 peewack, # 2006/07/12 18:10:33
発言者 ELV1S, # 2006/07/10 17:49:31
I'll update it today.
EDIT: Done
発言者 grafio, # 2006/07/08 14:09:41
- Make it not possible to drag using the CSS:
- It seems to be quite laggy, I assume that this is because you are using canvas and are clearing the entire rectangle instead of just the line. To clear only the line more efficiently you should stroke over it again with a wider line and use the javascript:
- Place the points using onmousedown instead of onclick to make it more responsive to the click.
発言者 Benjamin Joffe, # 2006/07/08 13:55:57
発言者 grafio, # 2006/07/08 9:56:03
発言者 grafio, # 2006/07/07 0:00:28
発言者 d.i.z., # 2006/07/06 20:24:26
Also I fixed the favicon
発言者 grafio, # 2006/07/06 16:15:34
発言者 Meneldor, # 2006/07/05 13:10:48
発言者 seifip, # 2006/07/05 12:59:33
And perhaps the X-Y co-ords could be calculated as the screen co-ords, instead of relative to the edges of the widget?
Great idea, very cleanly executed, and very, very useful!
発言者 johnnysaucepn, # 2006/07/05 10:52:35
発言者 grafio, # 2006/07/05 10:06:22