Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations TouchToneTommy on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Hover Image doesn't go away in IE6

Status
Not open for further replies.

Pirellio

Programmer
Aug 25, 2008
18
US
Works good in FF, in IE6 the images appear, but when I mouse out the images stay, even when I mouse over the next preview.

IE6 images stay, need to have them go away on mouse out.

<style type="text/css">

/* =Hoverbox Code
----------------------------------------------------------------------*/

.hoverbox
{
cursor: default;
list-style: none;
}

.hoverbox a
{
cursor: default;
}

.hoverbox a .preview
{
display: none;
}

.hoverbox a:hover .preview
{
display: block;
position: absolute;
top: -300px;
left: -95px;
z-index: 1;
}

.hoverbox img
{
background: fff;
border-color: aaa ccc ddd bbb;
border-style: solid;
border-width: 1px;
color: inherit;
padding: 2px;
vertical-align: top;
width: 100px;
height: 125px;
}

.hoverbox li
{
background: eee;
border-color: ddd bbb aaa ccc;
border-style: solid;
border-width: 1px;
color: inherit;
display: inline;
float: left;
margin: 3px;
padding: 5px;
position: relative;
}

.hoverbox .preview
{
border-color: 000;
width: 300px;
height: 300px;
}
</style>


<ul class="hoverbox">
<li><a href="#">View Larger<img src="products/myimage.jpg" alt="description" class="preview"></a></li>
</ul>
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top