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);

你可能感兴趣的:(JavaScript,jquery,function,filter,IE,callback)