Jump to content

Simple HTML hover over


mallorca

Recommended Posts

Hello

Im having a little trouble making a picture appear when hovering over a text

the simple html im using came from another online blog

 

it works however the picture is transparent ---- How can i stop the transparency ?? so you cannot you can see my underneath map & labelling

 

</head>
<body>
<div class="Object0"><img src="files/Samed Island Map_no bay names %281%29.jpg" alt="" width="1023px" height="1548px"></div><br/>
</span></div>
<br/>
<style type='text/css'>
a img { display:none; }
a:hover img { display:block;}
</style>
<div class="Object1">
<a href="#">Ao Noi Na<img src="files/ko-samet-map600.gif"/></a><br/>
</span></div>
<style type='text/css'>
a img { display:none; }
a:hover img { display:block; }
</style>
<div class="Object2">
<a href="#">Ao Klang<img src="http://www.banphe.net/files/newmermaid.jpg"/></a>
</span></div>
i have a test page im using: http://www.banphe.net/newmap.html
Any help would be greatly received, please keep it simple so i can understand it - newbie to this
Thank You
Phil
Edited by mallorca
Link to comment
Share on other sites

I don't see anything affecting opacity, so I would suggest that the image itself my be the source of the transparency. I which case there is not you can do in HTML or CSS to adjsut that, you will need to fix the image in a graphics program.

Link to comment
Share on other sites

Its nothing to do with transparency/opacity of element or image its to do with div container z-index layering.

 

You have to give the pop-up image div container elements a higher z-index than the others, because you are increasing each consecutively the div elements below it have higher z-index layer level and so they shown above pop-up div.

 

Also, don't place styling in body tag element, place in head element where they should be.

Edited by dsonesuk
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...