5

我正在淡出，并在一个 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 中运行良好。请问有什么想法吗？

4

4 回答 4

10

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

.formErrors {background-color:white;}

另一种选择是使用fadeInand fadeOut：动画一直很丑，但至少效果很好：http: //jsbin.com/aboxa

于 2009-12-08T09:44:56.980 回答
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();  
});
};

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

于 2010-12-08T19:35:55.757 回答
2

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

.formErrors{position:relative;}
于 2011-12-01T16:55:15.503 回答
1

在 IE8 中使用 <!DOCTYPE html> 为我解决了这个问题。文本在淡入淡出期间看起来仍然是块状的，但之后它会变得平滑

于 2011-12-02T06:03:18.260 回答