IE正在失去ClearType
我正在经历一些非常奇怪的事情！
我有一个div，我隐藏着JS（jQuery）。 像这样：
$('#myDiv').hide(); 然后，当我像这样做一个淡入淡出：
$("#myDiv").fadeIn('slow');
然后文本在IE中丢失ClearType但在FF中丢失。 如果我选择fadeIn的切换，那么一切都很好。
IE是什么，有什么解决方案，因为它看起来很糟糕。 （我在这一点上可能已经理解了ClearType）
快速搜索主题显示以下内容：
jQuery fadeIn / fadeOut IE cleartype故障
问题似乎是CSS“filter”属性不会自动删除。 解决此问题的最简单方法是手动删除它：
$('#myDiv').fadeIn('slow', function() { this.style.removeAttribute('filter'); });
正如上面的博客文章所解释的那样，这是一个相当混乱的解决方案。
摘自博客文章，包括解决此问题的更清晰的解决方案 ：
这意味着我们每次想要淡化元素时，都需要删除filter属性，这会使我们的代码看起来很乱。
一个简单，更优雅的解决方案是通过jQuery的插件接口将.fadeIn（）和.fadeOut（）函数与自定义函数包装在一起。 代码完全相同，但我们不是直接调用淡入淡出函数，而是调用包装器。 像这样：
$('#node').customFadeOut('slow', function() { //no more fiddling with attributes here });
那么，你如何使这个工作？ 在包含用于添加function的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);
一种方法是在div（通常）白色上设置背景颜色。
当淡入淡出应用于IE时，它正在应用它（至少通过jquery）dxtransform类，这将使它失去任何抗锯齿效果，直到它的不透明度回到1。
我已经成功地采用了一种“通用”解决方案。 如果不透明度在0和1之间， removeAttribute不起作用，所以我的两分钱解决方案如下：
把这段代码放在jQuery animate方法定义的第一行之后（jquery.xxxjs）
animate: function( prop, speed, easing, callback ) { var optall = jQuery.speed(speed, easing, callback); /* * IE rendering anti-aliasing text fix. */ // fix START var old_complete_callback = optall.complete; optall = jQuery.extend( optall, {complete: function(){ if (jQuery.browser.msie) { var alpha = $(this).css('opacity'); if(alpha == 1 || alpha == 0) { this.style.removeAttribute('filter'); } } if (jQuery.isFunction(old_complete_callback)) { old_complete_callback.call(this); } } }); // fix END ...
希望这会有所帮助……
我已经成功地采用了一种“通用”解决方案。 如果不透明度在0和1之间，removeAttribute不起作用，所以我的两分钱解决方案如下：
把这段代码放在jQuery animate方法定义的第一行之后（jquery.xxxjs）
animate: function( prop, speed, easing, callback ) { var optall = jQuery.speed(speed, easing, callback); /* * IE rendering anti-aliasing text fix. */ // fix START var old_complete_callback = optall.complete; optall = jQuery.extend( optall, {complete: function(){ if (jQuery.browser.msie) { var alpha = $(this).css('opacity'); if(alpha == 1 || alpha == 0) { this.style.removeAttribute('filter'); } } if (jQuery.isFunction(old_complete_callback)) { old_complete_callback.call(this); } }}); // fix END ...
希望这会有所帮助……
我读过Firefox 2在应用不透明度时会使用自己的文本渲染引擎（至少在Mac上）。 这有时看起来很奇怪。
我用这个CSS来解决这个问题（它似乎根本没有影响性能）
body { -moz-opacity: 0.99; }
这也可以在IE中使用。 哦，但你需要使用IE的专有filter属性。
好的，这是我有史以来最糟糕的解决方案
body text
立即隐藏身体，并在文档完成时将其淡入。 然后你基本上禁用cleartype。
哦， 请不要任何人这样做。 或者，如果它真的对你有意义，那么测试一下。 请记住，在整个DOM加载之前，您不会看到任何内容。 我也看到了一些奇怪的图形故障。