IE đang mất ClearType

Tôi đang trải nghiệm điều gì đó thật kỳ lạ!IE đang mất ClearType

Tôi có một div mà tôi đang ẩn với JS (jQuery). Như thế này:

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

Sau đó, khi tôi thực hiện một fadeIn như thế này:

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

thì văn bản mất ClearType trong IE nhưng không phải trong FF. Nếu tôi đi với chuyển đổi insted của fadeIn, sau đó nó là tất cả tốt.

IE là gì và có bất kỳ giải pháp nào cho nó không vì nó trông khủng khiếp. (Tôi có ClearType trên như bạn có thể hiểu được tại thời điểm này)

Nguồn

2009-01-04 Adis

Một tìm kiếm nhanh về đề tài này cho thấy như sau:

jQuery fadeIn/fadeOut IE cleartype glitch

Vấn đề dường như là CSS "bộ lọc" thuộc tính không được tự động gỡ bỏ. Giải pháp đơn giản nhất cho vấn đề này sẽ được loại bỏ nó bằng tay:

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

Như bài đăng blog trên giải thích, đây là một giải pháp khá lộn xộn.

Trích từ bài đăng blog, trong đó có một giải pháp sạch cho vấn đề này:

này có nghĩa là mỗi lần chúng ta muốn phai một phần tử, chúng ta cần phải loại bỏ các thuộc tính lọc, mà làm cho mã của chúng tôi trông lộn xộn.

Một giải pháp đơn giản, thanh lịch hơn sẽ được quấn chức năng .fadeIn() và .fadeOut() với một chức năng tùy chỉnh thông qua giao diện plugin của jQuery . Mã sẽ chính xác là giống nhau, nhưng thay vì gọi trực tiếp các chức năng mờ dần, chúng tôi gọi là trình bao bọc . Cũng giống như vậy:

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

Vì vậy, làm thế nào để bạn làm việc này? Chỉ cần bao gồm mã sau đây sau khi bạn bao gồm thư viện jQuery cho chức năng được thêm vào .

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

Nguồn

2009-01-04 14:34:00

grr tại sao họ không thể đặt điều này trong tiêu chuẩn fadeIn. chỉ cần xác nhận nó không phải trong 1.3.1 (ít nhất là không phải không yêu cầu cấu hình bổ sung) vì vậy có lẽ không có –

ngay cả với giải pháp này nó vẫn trông khá khủng khiếp theo ý kiến của tôi. rõ ràng của nó rõ ràng có một trục trặc. tốt nhất để thử càng tốt để chỉ mờ dần trong các hộp màu và để cho văn bản xuất hiện ngay lập tức –

Kể từ jQuery 1.9, trình nhận dạng jQuery.browser không được chấp nhận. Tuyệt vời ... :-(Bất kỳ đề xuất nào về cách triển khai mã trên thông qua "phát hiện tính năng" thay vì "phát hiện trình duyệt"? – ClearCloud8

Khi phai được áp dụng cho IE, nó được áp dụng nó (ít nhất là qua jquery) lớp dxtransform, mà sẽ làm cho nó mất bất kỳ tác dụng khử răng cưa cho đến khi Opacity của nó là trở lại một.

Nguồn

2009-01-04 14:33:27 SuperRoach

Tôi đã đọc Firefox 2 sử dụng engine văn bản vẽ riêng của mình bất cứ khi nào opacity được áp dụng (ít nhất là trên máy Mac). Điều này đôi khi trông kỳ lạ.

Tôi đã đấu tranh này với CSS này (và nó dường như không ảnh hưởng đến hiệu suất ở tất cả)

body { 
    -moz-opacity: 0.99; 
}

này thể làm việc trong IE quá. Nhưng bạn cần sử dụng tài sản filter của IE.

Nguồn

2009-01-04 14:37:15 alex

Một cách là đặt màu nền trên màu trắng (thường).

Nguồn

2009-01-04 15:02:15 redsquare

không hoạt động với tôi trong IE7 trên vista –

Điều này đã làm việc cho tôi vài lần Tôi nghĩ bạn cần phải thiết lập màu nền trên phần tử đang bị mờ dần vào hoặc ra. –

-1

Ok đây là giải pháp tồi tệ nhất của tôi bao giờ:

<head> 
    <script> 
     $(function() { 
       $(document.body).fadeIn(0); 
     }); 
    </script> 
</head> 

<body> 

    <script> 
     $(document.body).hide(); 
    </script> 

    body text 
</body>

Ngay lập tức che giấu cơ thể, và mờ dần nó trong khi tài liệu được hoàn tất. Sau đó, bạn về cơ bản vô hiệu hóa cleartype.

Oh và XIN VUI LÒNG không ai làm điều này. Hoặc nếu nó THỰC SỰ có vẻ hợp lý với bạn thì hãy kiểm tra nó tốt. Chỉ cần nhớ bạn sẽ không thấy bất cứ điều gì cho đến khi toàn bộ DOM được tải. Tôi cũng thấy một số trục trặc đồ họa khủng khiếp.

Nguồn

2009-01-26 11:55:32

Tôi đã quản lý để lấy một giải pháp "chung chung". removeAttribute không hoạt động nếu opacity là giữa 0 và 1, vì vậy giải pháp hai xu của tôi sau:

Đặt mã này ngay sau khi dòng đầu tiên của jQuery động định nghĩa phương pháp (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 

    ...

Hy vọng điều này sẽ giúp ...

Nguồn

2012-01-09 11:48:30 Rogi

Tôi đã cố gắng giải quyết một giải pháp 'chung'. removeAttribute không hoạt động nếu opacity là giữa 0 và 1, vì vậy giải pháp hai xu của tôi sau:

Đặt mã này ngay sau khi dòng đầu tiên của jQuery động định nghĩa phương pháp (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 

...

Hy vọng điều này sẽ giúp ...

Nguồn

2012-01-10 13:07:25 Rogi

Trả lời

Các vấn đề liên quan