Question

有没有办法在jQuery中对fadeIn效果进行全局替换，以解决IE6-IE8中透明png淡入显示分歧的问题？

我的意思是，我现在有这样的事情：

$(whichCarousel).find('ul.display li:eq(' + aSpecimen + ')').fadeIn("fast");

不是通过使用.fadeIn并执行if / else语句的我的每个函数，而是在jQuery中有一种全局说法：

if ($.browser.msie && $.browser.version.substr(0,1)<9) >> find ".fadeIn" and change to ".show();"` ?

Answer 1

您可以覆盖show()方法，以便fadeIn()如果它是兼容的浏览器，或者如果不是，则恢复原始show()。这是一个例子：

<button id="go">Try Me</button>
<div id="test" style="display: none">Your Content</div>

<script type="text/javascript">

(function($, oldMethod) {    
    $.fn.show = function() {
        if ($.browser.msie && $.browser.version.substr(0,1) < 9) {
            oldMethod.apply(this, arguments);   
        } else {
            $(this[0]).css("opacity",0);
            oldMethod.apply(this, arguments);
            $.fn.animate.apply($(this[0]), [{opacity:1}, {duration:1000}]);
        }
    };
})(jQuery, jQuery.fn.show);

$(function() {
    $('#go').click(function() {
        $('#test').show();
    });
});

</script>

您可以看到this jsFiddle的演示。我在IE9和Chrome 13中测试过，似乎运行良好。

修改

我刚才意识到这种效率低下。它在每次调用show()时检查浏览器版本。您可能可以这样做（未经测试）：

(function($, oldMethod) { if (!($.browser.msie && $.browser.version.substr(0,1) < 9)) { $.fn.show = function() { $(this[0]).css("opacity",0); oldMethod.apply(this, arguments); $.fn.animate.apply($(this[0]), [{opacity:1}, {duration:1000}]); }; } })(jQuery, jQuery.fn.show);

这样，只有在版本9下的非IE浏览器才会覆盖该函数。A jsFiddle example。原始show()函数可以简单地存在。

此外，这个块的原因是：

$(this[0]).css("opacity",0); oldMethod.apply(this, arguments); $.fn.animate.apply($(this[0]), [{opacity:1}, {duration:1000}]);

是因为fadeIn()在某个时刻调用show()，并且由于无限递归而导致堆栈溢出。调用.animate({opacity:"show"}) also call show（）`，因此也不起作用。我挖掘了jQuery代码以提取重要的位来重新创建效果，而不会导致堆栈溢出。

全局替换fadeIn - IE错误，jQuery

1 个答案: