IE 正在失去 ClearType [英] IE is losing ClearType

问题描述

我遇到了一些非常奇怪的事情！

我有一个用 JS (jQuery) 隐藏的 div.像这样:

$('#myDiv').hide();

然后当我像这样进行淡入时:

$("#myDiv").fadeIn('slow');

然后文本在 IE 中丢失 ClearType，但在 FF 中没有.如果我使用切换设置的淡入淡出，那么一切都很好.

IE 在做什么，是否有任何解决方案，因为它看起来很糟糕.(我打开了 ClearType，你现在可能已经理解了)

解决方案

对该主题的快速搜索显示以下内容:

jQuery 淡入/淡出 IE cleartype 故障

问题似乎是没有自动删除 CSS过滤器"属性.解决此问题的最简单方法是手动将其删除:

$('#myDiv').fadeIn('slow', function() {this.style.removeAttribute('filter');});

正如上面的博文所解释的，这是一个相当混乱的解决方案.

摘自博文，包括针对此问题的更简洁的解决方案:

<块引用>

这意味着我们每次想要淡化一个元素，我们需要删除过滤器属性，其中让我们的代码看起来很乱.

一个简单、更优雅的解决方案是是包装 .fadeIn() 和.fadeOut() 函数与自定义功能通过插件接口jQuery.代码正是相同，但不是直接调用淡入淡出函数，我们称之为包装纸.像这样:

$('#node').customFadeOut('slow', function() {//这里不再摆弄属性});

<块引用>

那么，你是如何做到这一点的?只是在你之后包含以下代码包含 jQuery 库添加了功能.

(function($) {$.fn.customFadeIn = 函数(速度，回调){$(this).fadeIn(speed, function() {如果(jQuery.browser.msie)$(this).get(0).style.removeAttribute('filter');如果(回调！= 未定义)打回来();});};$.fn.customFadeOut = 函数(速度，回调){$(this).fadeOut(speed, function() {如果(jQuery.browser.msie)$(this).get(0).style.removeAttribute('filter');如果(回调！= 未定义)打回来();});};})(jQuery);

I'm experiencing something really strange!

I have a div that I'm hiding with JS (jQuery). Like this:

$('#myDiv').hide();

Then when I make a fadeIn like this:

$("#myDiv").fadeIn('slow');

then the text loses ClearType in IE but not in FF. If I go with toggle insted of fadeIn, then it's all fine.

What is IE up to and is there any solutions for it because it looks horrible. (I have ClearType on as you maybe understand at this point)

解决方案

A quick search on the subject shows the following:

jQuery fadeIn/fadeOut IE cleartype glitch

The problem seems to be that the CSS "filter" attribute is not automatically removed. The most simple solution to this problem would be removing it manually:

$('#myDiv').fadeIn('slow', function() {
   this.style.removeAttribute('filter');
});

As the blog post above explains, this is a rather messy solution.

Excerpt from the blog post, including a cleaner solution to this problem:

This means that every single time we want to fade an element, we need to remove the filter attribute, which makes our code look messy.

A simple, more elegant solution would be to wrap the .fadeIn() and .fadeOut() functions with a custom function via the plugin interface of jQuery. The code would be exactly the same, but instead of directly calling the fade functions, we call the wrapper. Like so:

$('#node').customFadeOut('slow', function() { 
   //no more fiddling with attributes here
});

So, how do you get this working? Just include the following code after you include the jQuery library for the added functionality.

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

这篇关于IE 正在失去 ClearType的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！