jQuery不透明度动画在Internet Explorer中扭曲定位

时间:2009-09-15 02:20:38

标签: jquery internet-explorer css opacity jquery-animate

我正在尝试使用opacity属性和jQuery animate函数在水平选项卡菜单上实现类似点击的效果。以下是执行此操作的代码:

$(document).ready(function() {      
    $("div#header > ul > li").click(function(event) {
        $(this).animate({opacity: 0.7} ,"fast", "", function() {
            $(this).animate({opacity: 1} ,"fast");
        });
    });
});

我的问题发生在Internet Explorer 7和6上。使用不透明度属性设置动画时,水平菜单中的标签会丢失其初始位置。

Click here访问我的网站。要查看问题,请单击“Contato”,然后单击“Início”(对不起,它是用葡萄牙语写的,但您应该能够看到错误发生)。注意,直到现在我才在IE7 / IE6中检测到这个问题!

提前谢谢!

1 个答案:

答案 0 :(得分:1)

我认为这只是一个涉及不透明度和Internet Explorer的错误,因为IE没有不透明度支持。 来自 jQuery.support.opacity 属性的jQuery documentation

  

不透明度:如果是浏览器,则等于true   可以正确解释不透明度   style属性(目前是假的   IE,它使用alpha过滤器。)

为了避免这个错误并且仍然对兼容的浏览器产生影响,我将动画代码包装在以下条件中:

if ($.support.opacity) {
//animation code
}