Opacity CSS not working in IE8
- by Alistair Christie
I'm using CSS to indicate the trigger text for a jQuery slide-down section: i.e. when you hover over the trigger text the cursor changes to a pointer and the opacity of the trigger text is reduced to indicate that the text has a click action.
This works fine in Firefox and Chrome, but in IE8 the opacity doesn't change.
I've tried a variety of CSS settings without any success.
For example
HTML:
<h3 class="slidedownTrigger">This is the trigger text</h3>
CSS:
.slidedownTrigger
{
cursor: pointer;
-ms-filter: “progid:DXImageTransform.Microsoft.Alpha(Opacity=75)”;
filter: alpha(opacity=75);
-khtml-opacity: 0.75;
-moz-opacity: 0.75;
opacity: 0.75;
}
What's stopping IE changing the opacity? Note: I've tried this on a variety of different elements, swapping round the order of the CSS statements, and just using the IE ones on their own. I've also tried using
-ms-filter: "alpha(opacity=75)";
but with no success.
I've run out of things to try to get opacity modification working in IE8.
Any ideas?
