I cant get a div to stay over an image map. I tried absolute positioning as well. It looks fine in dreamweaver but wont work in live mode or browsers. I know it has to do with image map, not my technique to place a div on a simple image. Any thoughts? Is it even possible?
See live link here: http://ift.tt/1EgL7xU
Code below:`
<style type="text/css">
#container {
position: relative;
width: 800px;
margin-right: 0px;
margin-left: 0px;
}
#popup {
width: 200px;
height: 199px;
visibility: visible;
z-index: 10;
float: right;
padding-left: 0px;
margin-left: -300px;
margin-top: 300px;
background-color: #8C494A;
}
#image {
width: 700px;
height: 491px;
float: left;
left: 0;
top: 0;
}
</style>
</HEAD>
<BODY BGCOLOR=black leftmargin="0" marginwidth="0" topmargin="0" marginheight="0">
<div id="container">
<div id="popup">image pops up on roll ivergoes here</div>
<div id="image"> <img src="images/crowdcontrolprod.jpg" alt="" width="700" height="491" usemap="#Map" border="0" href="#"/> </div>
<map name="Map">
<area shape="rect" coords="400,439,476,463" href="prodaccessories.html">
<area shape="rect" coords="367,396,483,424" href="prodbarriers.html">
<area shape="rect" coords="373,363,480,381" href="prodsignposts.html">
<area shape="rect" coords="372,319,480,345" href="prodretractablebeltwall.html">
<area shape="rect" coords="370,287,479,306" href="prodrope.html">
<area shape="rect" coords="357,261,485,279" href="prodretractablebelt.html" onMouseOver="MM_showHideLayers('popup','','show')" onMouseOut="MM_showHideLayers('popup','','hide')">
<area shape="rect" coords="10,466,76,482" href="homepage.html">
</map>
</div>
</BODY>
</HTML>
`
Aucun commentaire:
Enregistrer un commentaire