使用div.fadehover的jQuery动画不透明度在IE8中根本不起作用

Question

使用div.fadehover的jQuery动画不透明效果在Chrome，FF和Safari中运行良好，在IE8中根本不起作用。完全没有褪色。 http://www.youarenottheproblem.com/ 尝试过滤：继承;但也许不把它放在正确的位置 - 任何想法？ 请解释一下，我喜欢这个。

Answer 1

在IE8中，不考虑CSS属性的不透明度。您还需要在悬停情况下执行"filter":"-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";"，并在回调中执行"filter":"-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"。

您的代码：

$(document).ready(function(){

$("img.a").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "1"}, "slow");
});

});

固定代码：

$(document).ready(function(){

$("img.a").hover(
function() {
$(this).stop().animate({"opacity": "0", "filter" : "-ms-filter":"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "1", "filter" : "-ms-filter":"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"}, "slow");
});

});