JQuery - IE 6,7 Opacity不起作用

时间:2010-12-15 10:47:41

标签: jquery internet-explorer internet-explorer-7 internet-explorer-6 opacity

是的,网络上的一些人有同样的问题..但对此没有真正的答案。 JQuery开发人员说IE 6,7,8是支持者,但我真的需要不透明度动画才能开始工作。

但这不起作用..我需要IE 6,7的解决方案。 我听说ie的alpha过滤器是好事..但请给我一些建议我的朋友。

nya - 这里有一些非元讨论的代码:

$('#video').click(function() {
    $button = $(this);
    if ( clickedv === 0){
    if( !$button.hasClass( 'disabled' ) ) {
        $button.addClass( 'disabled' );
    clickedv = 1;
    $('#video').animate({width: 0, height: 0, top: 52, left: 311},0);
       $('.flv').animate({left: 19, opacity: '1'},0).css('display', 'inline');
       $('galleria-thumbnails').animate({opacity: '0.3!important'},0);
        $('.close').animate({opacity: '1'},0,

        function() { $button.removeClass('disabled') });

    } 
    }

});

$('.close').click(function() {
    $button = $(this);

    if ( clickedv == 1){
    if( !$button.hasClass( 'disabled' ) ) {
        $button.addClass( 'disabled' );
    clickedv = 0;
    $('#video').animate({width: 164, height: 29, top: 498, marginLeft: 262},0);
       $('.flv').animate({left: 2222, opacity: '0'},0).css('display', 'none');
        $('.close').animate({opacity: '0'},0,
        function() { $button.removeClass('disabled') });

    } 
    }

});

3 个答案:

答案 0 :(得分:1)

IE不支持opacity作为CSS样式。

它有替代方法通过样式表使用IE特定的filter样式进行不透明度,但这不是我在你的情况下推荐的答案 - 当你使用CSS时会变得非常难看必须支持几种不同的语法变体,更糟糕的是,如果你在javascript中动态更改它。

您需要做的是使用jQuery的淡入淡出方法。这将为您提供良好的跨浏览器兼容的动画透明效果。请参阅jQuery manual pages for more info

答案 1 :(得分:1)

来自我的test ie8不喜欢在jquery animate语句中使用!important标记,而chrome似乎对此感到满意。如果删除它会有效吗?

答案 2 :(得分:0)

IE使用alpha过滤器,因此您需要为不透明度执行两种样式。

opacity:0.3; filter:alpha(opacity=30);

某些旧版本的Mozilla需要

-moz-opacity:0.3;

您也可以尝试

progid:DXImageTransform.Microsoft.Alpha(opacity=30)