2012-08-14 85 views
0

我需要在IE8中繪製一個傾斜的橢圓。在IE8中圈顯示不正確

要顯示邊界半徑用於PIE.js

要在其他瀏覽器顯示用代碼:

.levelConfidenceCircleBlue { 
    position: relative; 
    float: left; 
    width: 19px; 
    height: 18px; 
    background: none; 
    z-index: 10; 
    margin-top: -8px; 
    margin-left: 5px; 
    margin-right: 2px; 
} 

.levelConfidenceCircleBlue:before, 
.levelConfidenceCircleBlue:after { 
    position: absolute; 
    content: ""; 

    width: 15px; 
    height: 18px; 
    left: 0px; 
    background: #00A7E7; 
    -moz-border-radius: 50px/63px; 
    border-radius: 50px/63px; 
    -webkit-transform: rotate(26deg); 
     -moz-transform: rotate(26deg); 
     -ms-transform: rotate(26deg); 
     -o-transform: rotate(26deg); 
      transform: rotate(26deg); 
    -webkit-transform-origin: 0 100%; 
     -moz-transform-origin: 0 100%; 
     -ms-transform-origin: 0 100%; 
     -o-transform-origin: 0 100%; 
      transform-origin: 0 100%; 
} 

要調整爲使用IE8劈:

<! - [if IE 8]> 
.levelConfidenceCircleBlue:before, 
.levelConfidenceCircleBlue:after { 
    position: absolute; 
    content: ""; 

    width: 15px; 
    height: 18px; 
    left: 0px; 

    background: none; 
    border-radius: 60px 40px 60px 40px; 
    -pie-background: #00A7E7; 
} 
<! [endif] -> 

沒有改變。但是,如果將其更改爲:

<! - [if IE 8]>  
.levelConfidenceCircleBlue { 
     position: relative; 
     float: left; 
     width: 19px; 
     height: 18px; 
     background: none; 
     z-index: 10; 
     margin-top: -8px; 
     margin-left: 5px; 
     margin-right: 2px; 
    } 

    .levelConfidenceCircleBlue:before, 
    .levelConfidenceCircleBlue:after { 
     position: absolute; 
     content: ""; 

     width: 15px; 
     height: 18px; 
     left: 0px; 

     background: none; 
     border-radius: 60px 40px 60px 40px; 
     -pie-background: #00A7E7; 
    } 
<! [endif] -> 

它顯示正確的IE8在IE9 - 顯示方塊,在其他瀏覽器 - 不顯示任何內容。 除了沒有黑客的常規班/ * /和\ 0 /不起作用。

你能告訴我該如何解決這個問題嗎?

回答

0

問題解決了。
該問題與PIE.js連接。

連接被改變爲:

updatePIEButtons = function() { 
    if ($.browser.msie && $.browser.version == 8) { 


     $(".levelConfidenceCircleBlue").each(function() { 
       PIE.detach(this); 
       PIE.attach(this); 
      }); 
     } 
     else { 
      $("[other classes]").each(function() { 
       PIE.detach(this); 
       PIE.attach(this); 
      }); 
     } 
    }; 
0

您對IE的條件標記看起來不對。

<!--[if IE 8]> IE 8.0 <![endif]-->