Yep. Still Using ImageMaps. What the heck are those you ask?

Old programmers can learn plenty of new tricks, especially as so many Web technologies just keep rolling on out. An old one that comes from the original html (nothing.0) specification a long time ago in a galaxy oh so thither and yon is ye olde image map.

Have to insert a bit of a snort here. When I checked the MDN page on image maps to see if I had the coordinates property values correct, for a second I thought this sandbox was telling me I could put the various colored parts together like this in CSS. Then I remembered I was looking for img map area coords help. For a few brief seconds I thought there was a new CSS spec that could put objects together to form various shapes such as this pentastar out of random rectangles with just a few simple declarations. I Was like, Wow. Cool! I’ll bet that will take some time to figure out how to do.


Check out my to see a very simple image map in action that tells the style.cursor to change, onmouseover, the east and west sections of the titular graphic. I don’t use the site for much except some cool and simple email addresses. So if you have any ideas or thoughts on what should be there, comment.drop(arguments).

As soon as I resurrect my old Feline Rescue of Northern Nevada site (the rescue shuttered its doors in 2015 and I have the site on one of those drives in the pile in the corner of the room) I can sample a more complicated image map with rectangles, circles and parabolas all over the place, tightly packed in so the default href wouldn’t kick in at an unexpected pixelschpot (that’s German for pixel spot).

The main page was a graphic rendering of the front of a Sierra cabin which changed throughout each season with snow, flowers, bright sunshine and fall colors, overlaid with a complex image map to guide site guests into various rooms within the site.

Here’s MND’s spec on the html element tag, <map>. And W3‘s.

Author: Brooks Rogers

Programming for a long time now. Working with Stencil these days and creating custom HTML elements/web components.

Leave a Reply

Your email address will not be published. Required fields are marked *