jQuery fadeIn()、fadeOut() IE下无法正常显示解决办法

最通常的解决办法就是移除 filter 这个 CSS 属性。用普通的 javascript 代码就这样写:

document.getElementById('node').style.removeAttribute('filter');

用  jQuery  就这样写:

$('#node').fadeOut('slow', function() {
   this.style.removeAttribute('filter');
});

这意味着每次我们要改变一个元素的透明度时就要移除它的 filter 属性, 这让我们的代码看起来很二。

一个简单并且更加优雅的方法就是通过 jQuery 的插件接口写一个自定义的函数来封装 .fadeIn() 和 .fadeOut()。代码实际上是一样的,只是我们要调用这个封装器函数,而不是直接调用 .fadeIn() 和 .fadeOut()。就像这样:

$('#node').customFadeOut('slow', function() {
   // 这里就不要再折腾什么 CSS 属性了
});

那到底要怎么弄才能使上面的代码生效呢?只需要在包括 jQuery 库之后包括下面这段代码就行了。

(function($) {
    $.fn.customFadeIn = function(speed, callback) {
        $(this).fadeIn(speed, function() {
            if(jQuery.browser.msie)
                $(this).get(0).style.removeAttribute('filter');
            if(callback != undefined)
                callback();
        });
    };
    $.fn.customFadeOut = function(speed, callback) {
        $(this).fadeOut(speed, function() {
            if(jQuery.browser.msie)
                $(this).get(0).style.removeAttribute('filter');
            if(callback != undefined)
                callback();
        });
    };
})(jQuery);

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值