2012-11-12 30 views
5

Tôi đã nhận thấy trong IE9 rằng việc sử dụng ma trận DXIImageTransform sẽ pixelate xoay văn bản. Tôi không có vấn đề này trong IE8 hoặc 7. Thông thường tôi sẽ sử dụng tùy chọn css3 trong IE9 nhưng vì lý do ngoài tầm kiểm soát của tôi, trang hiển thị ở chế độ quirks (html5 hợp lệ iframe được nhúng trong trang bên thứ 3 không có loại tài liệu)DXIMageTransform.Microsoft.Matrix bị mờ trong IE9

Đây là mã tôi đang sử dụng:

<!--Looks like crap but is my only option in quirks mode--> 
<span style="position:absolute; 
    filter:progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', 
    M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);"> 
    Does this make my butt look pixelated?  
</span> 

trong IE8, kết quả luân chuyển văn bản là suôn sẻ, nhưng trong IE9 nó rất pixelated. Hãy so sánh này (mà không làm việc trong chế độ quirks)

<!-- looks great but doesn't work in quirks mode--> 
<span style="position:absolute; top:150px; -ms-transform: rotate(-45deg);"> 
    Does this make my butt look pixelated? 
</span> 

Để nhìn thấy nó trong hành động, hãy kiểm tra fiddle này trong IE9 http://jsfiddle.net/U4CCD/3/

Câu hỏi của tôi, làm thế nào tôi có thể xoay văn bản trong IE9, ở chế độ quirks, trông không bị mờ và bị mờ. Tại sao ma trận biến đổi bắt đầu hút trong IE9?

Nếu bạn may mắn không được chạy IE9, đây là những gì tôi thấy. Ví dụ rõ ràng hơn là nó trông như thế nào trong IE8 và nó trông như thế nào khi sử dụng các phép biến đổi css3.

IE9 sucks

Trả lời

4

Cuối cùng tôi thấy rằng đây chỉ đơn giản là không thể được thực hiện với cấu hình hiện tại của tôi. Tôi đã, tuy nhiên, có thể làm việc xung quanh nó bằng cách gói trang html5 hợp lệ của tôi trong một đối tượng mà sau đó đã được nhúng trong khung nội tuyến. Trong IE 9, điều này dường như cho phép trang của tôi hiển thị trong khung nội tuyến ở chế độ tiêu chuẩn và sử dụng biến đổi SVG trông sạch sẽ. Tôi đã tạo tập lệnh wrapper aspx sau:

<%@ Page Language="C#" %> 

<% 
    string url = "app/path"; 
    if(!String.IsNullOrEmpty(Request.QueryString["path"])) 
     url = HttpUtility.UrlDecode(Request.QueryString["path"]); 

    url += "?i=1"; 
    if(!String.IsNullOrEmpty(Request.QueryString["id"])) 
     url += "&id=" + Request.QueryString["id"]; 

    if(Request.Browser.Browser!="IE"||Request.Browser.MajorVersion!=9) { 
     Response.Redirect(url); 
    } 
    url += "&quirky=1"; 
%> 
<html> 
<head><title></title> 
</head> 
<body style="width:100%; height:100%; margin:0; padding:0; overflow:hidden;"> 
<object type="text/html" data="<% =url %>" style="overflow:hidden; width:100%; height:100%"></object> 
</body> 
</html> 
Các vấn đề liên quan