Menu
Hi there
I am trying to create a gallery whereby the pics are set to a lower opacity and when you rollover them, they light up to 100% opcaity. My gallery in working finr in firefox, but its not working in any of the IE’s.
Can anyone please assist me with a fix for this?
My code is as follows:
<ul id=”gallery”>
<li><a href=”images/Africa/Image1Large.jpg” title=”A Giraffe” rel=”lightbox[africa]”><img src=”images/Africa/image1.jpg”></a></li>
<li><a href=”images/Africa/Image1Large.jpg” title=”A Giraffe” rel=”lightbox[africa]”><img src=”images/Africa/image1.jpg” alt=”a giraffe”></a></li>
<ul>
ul#gallery {
list-style:none;
width: 960px;
margin: 0 auto;
margin-top:15px;
}
ul#gallery li, ul#gallery li img {
float:left;
width:148px;
border:0px;
margin-right:1px;
margin-bottom:1px;
filter: alpha(opacity=50);
-moz-opacity: .5;
opacity:0.5;
}
ul#gallery li a img:hover {
border:0px;
filter: alpha(opacity=1.0);
-moz-opacity: .10;
opacity:1.0;
}