问题
I have tried to get the opacity to work in IE, I am testing in IE8 at the moment, Chrome etc works fine but IE8 is terrible.
My code has been:
$('#mydiv').animate({'opacity': '0.5'});
and
$('#mydiv').css('opacity', 0.5);
The opacity is applied to the images held within this div but none of the text, it's very infuriating :( can anyone help me? Thanks in advance.
回答1:
try with this:
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; /* IE 8 */
filter: alpha(opacity=75); /* older IEs */
hope this is helpful for you
回答2:
$('#mydiv').fadeTo(0.5);
or
$('#mydiv').fadeTo(500,0.5);
or
$('#mydiv').fadeTo("slow",0.5);
http://api.jquery.com/fadeTo/
回答3:
IE8 does'nt apply opacity to elements withoute a layout. See this answer Opacity CSS not working in IE8
回答4:
jQuery handles setting the opacity in an IE ≥ 6 compatible way for you, both when using the css("opacity", value) and fade*() methods. But be sure to use the jQuery 1.x library which is compatible with IE 6, 7 and 8 as opposed to jQuery 2.x which is not (both are IE ≥ 9 compatible).
Here are the examples of using css("opacity", value) and fadeTo(duration, opacity):
- jQuery 1.x: http://jsbin.com/xabexa/2/edit?html,js,output
- jQuery 2.x: http://jsbin.com/xabexa/3/edit?html,js,output
However, there are issues in IE ≤ 8 related to opacity of semi-transparent PNGs: How to solve/hack fading semi-transparent PNG bug in IE8?
回答5:
Try this
filter: alpha(opacity=50);
instead of
opacity:0.5;
来源：https://stackoverflow.com/questions/10138232/jquery-applying-css-opacity