A.E.Veltstra
1 June 2003
A background image isn't really part of the web page. How does one apply an image map? Here's one solution using tables.
The picture you see below, isn't there. No, really. Try to copy it to your computer. It's a background image.
Why?
Well, because a friend asked if it was possible to attach an image map to a background image. Yes, I said, that's possible.
Now, there's two solutions. The one below uses a table to position. The other uses pure css positioning.
How's that done?
Take a look at the source code of this page. As you'll see, the background image is defined in the cascading style sheet. Thus, it's not really there but gets displayed anyway. Secondly, there's a transparant overlay on which the image map areas are mapped.
Afterthoughts
Using a table avoids having to position all elements fixed. You can use an identified div, instead. Employ the tabled solution if your current design already sports a table.
Why?
Well, because a friend asked if it was possible to attach an image map to a background image. Yes, I said, that's possible.
Now, there's two solutions. The one below uses a table to position. The other uses pure css positioning.
How's that done?
Take a look at the source code of this page. As you'll see, the background image is defined in the cascading style sheet. Thus, it's not really there but gets displayed anyway. Secondly, there's a transparant overlay on which the image map areas are mapped.
Afterthoughts
Using a table avoids having to position all elements fixed. You can use an identified div, instead. Employ the tabled solution if your current design already sports a table.
 |
Need problem solving?
Talk to me. Let's meet for coffee or over lunch. Mail me at “omegajunior at protonmail dot com”.