Image map tool

Image map tool

A handy little tool for working with the not so well known html <map> element. Image maps are used (mostly in static webpages) to define multiple clickable areas inside one large image, so you do not have to slice the entire image and float it back together with css. Unfortunatly the defineble areas of the image map work with coordinates, so you still have to securely measure some pixels with an image editor like photoshop or the gimp.

This tool does that for you. It let's you draw the areas on the image and automaticly generates the html code for you.

When the lines in the image from the example are blue, you can click them to edit them. The one you are adjusting will show up green and the others red. You can drag the top left and bottom right corners to adjust it's dimensions. Use to textboxes underneath it to change it's link and alt text. You can also add a new one.

The code is a little bit ruff, but if you are backend codebuilder you could easily grab it and adjust it to your backend.

launch

 

hypercode
flash games
flash stuff
_blank sites