Question

我渐渐淡出，并且在一个div中：

$('.formErrors').fadeTo('fast', 0); 
$('.formErrors').fadeTo('slow', 1);

但是当我在IE 8中这样做时，似乎有点CSS：

.formErrors li { font-weight: bold; }

导致文本变得非常扭曲:(下图）

http://www.newmania.com/images/error.jpg

我申请的HTML是：

<div class="formErrors">
There are errors in your submission. Please fix the following and try again:
<ul><li>Action is empty</li></ul>
</div>

它在Firefox中运行良好。有什么想法吗？

Answer 1

常见的解决方案是定义背景颜色，如果您还没有图像：
http://jsbin.com/axapa

.formErrors {background-color:white;}

另一个选择是使用fadeIn和fadeOut：动画一直很难看，但至少它很好地结束了：http://jsbin.com/aboxa

Answer 2

jQuery.fn.fadeIn = function(speed, callback) { 
return this.animate({opacity: 'show'}, speed, function() { 
    if (jQuery.browser.msie)  
        this.style.removeAttribute('filter');  
    if (jQuery.isFunction(callback)) 
        callback();  
});
};
jQuery.fn.fadeOut = function(speed, callback) { 
return this.animate({opacity: 'hide'}, speed, function() { 
    if (jQuery.browser.msie)  
        this.style.removeAttribute('filter');  
    if (jQuery.isFunction(callback)) 
        callback();  
});
};
jQuery.fn.fadeTo = function(speed,to,callback) { 
return this.animate({opacity: to}, speed, function() { 
    if (to == 1 && jQuery.browser.msie)  
        this.style.removeAttribute('filter');  
    if (jQuery.isFunction(callback)) 
        callback();  
});
};

此代码将覆盖特定于IE的JQuery中的一些淡入淡出属性。我能够成功地让fadeTo在IE中正常工作：https://app.tekstme.com/signup/

Answer 3

我知道这个帖子真的很老但我找到了一个简单的解决方案。使用背景不适用于我的情况，因为我背后的文本背后必须是透明的复杂背景。无论如何，我发现这个工作得很好（要添加的css代码）：

.formErrors{position:relative;}

Answer 4

使用＆lt;！DOCTYPE html＆gt;在IE8中为我解决了这个问题。在淡入淡出期间，文字仍然看起来很块，但之后它会平滑

当font-weight：bold时，jQuery FadeTo在IE8中导致像素化文本

4 个答案: