how to use html tag <area> if the image is background image

[david arnold]

Hi,

I have a background image on jsp login page which defined in css

#wrap {
margin: 0 auto;
width: 781px;
background: url(./images/image.jpg) top center no-repeat;
}

Now I want part of the area of the image could be clicked, and I found this <area> tag which works fine together with <img> tag. Example:

<img src ="planets.gif" width="145" height="126" alt="Planets" usemap ="#planetmap" />

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun" />
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury" />
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus" />
</map>

But my problem is that the image work as background, even if I put it in jsp file instead of css, it will be like

<div background="image.jpg">

, if I could not define the <img> tag, then I could not use <map> tag to associate with the <img>tag, right? Then I could not define the <area> tag.

Thanks for the help.

[Bear Bibeault]

No can do. A background is just a background. If you want it to be clickable, don't make it a background.

[david arnold]

I see. Thank you Bear for the info.

[Bear Bibeault]

If you need layered elements you could investigate using absolute and relative positioning to place an image element behind other elements.