HTML Background Image Map

Question

Can I create an image map from a background image? I would like the sides of the screen to be interactive, and I see no way to do this without a map.

Answer 1

You can create an absolute positional image with the following css so that it scales to fit the page.

img.bg{ position:absolute; z-index:-100; top:0;left:0;bottom:0;right:0; } 

then use this library to scale the image map with the page.

https://github.com/davidjbradshaw/image-map-resizer

Answer 2

You can use transparent fixed floating <a> tags, such as:

 <a style="display: scroll; position: fixed; top: 25px; left: 0px; width: 20px; height: 20px;" href="#"></a> <a style="display: scroll; position: fixed; top: 25px; right: 0px; width: 20px; height: 20px;" href="#"></a> 

You can use the bottom attribute instead of top to place tags relative to the bottom of the window.