IEのJQuery fancybox丸められたコーナーの問題

Question

次のコードでIEを除くすべてのブラウザにFancyboxの角が来ています。

jQuery('#fancybox-inner').css({'-moz-border-radius':'10px', '-webkit-border-radius':'10px', 'border-radius':'10px'}); 
      jQuery('#fancybox-outer').css({'-moz-border-radius':'10px', '-webkit-border-radius':'10px', 'border-radius':'10px'}); 
    jQuery('#fancybox-wrap').css({'-moz-border-radius':'10px', '-webkit-border-radius':'10px', 'border-radius':'10px'}); 

IEでfancyboxの角を丸くするにはどうすればよいですか？ここで

は私のコードです：

http://phone.invox.com/widgetconfig/mcwidget8/test.html

左のボタン「お電話」、あなたはそれをクリックしたとき、それは空想のボックスをロードします見つけてください。

おかげヤシン

Answer 1

IE 7、8 doesn't support境界半径性。 お試しくださいthisレックスとして

Answer 2

IEのためにあなたが画像を使用して丸みを帯びた角（各丸みを帯びた角の画像）を行うと、あなたが

http://www.devwebpro.com/25-rounded-corners-techniques-with-css/

をしたい隅にそれらを配置する必要があり、IEは国境-radiusプロパティをサポートしていません言及

Answer 3

は、私はこれで運を持っていた：私が使用している

$("a.fancy").fancybox({ 
    'titlePosition' : 'inside', 
    'overlayShow' : true, 
    'overlayOpacity': 0.5, 
    'overlayColor' : '#000', 
    'onComplete' : function() { 
    DD_roundies.addRule('#fancybox-title', '5px', true); 
    DD_roundies.addRule('#fancybox-outer', '10px', true); 
    } 
}); 

がhttp://www.dillerdesign.com/experiment/DD_roundies/

Answer 4

私が推薦します

fancybox CSSの検索で

<!--[if lt IE 9]> 
<script type="text/javascript" src="js/pie.js"></script> 
<script type="text/javascript" src="js/ie.js"></script> 
<![endif]--> 

：＃fancybox-コンテンツと＃のfancybox-外 追加CSS3あなたは、単純にこれを追加することで、サイト上のプラグインを実装するhttp://css3pie.com/

：あなたはCSS3 PIE JSプラグインを使用するにはborder-radius paramsをそれらのIDに追加します。このような

そしてie.js場所で何か：

$(function() { 
    $('#fancybox-outer, #fancybox-content').each(function() { 
     PIE.attach(this); 
    }); 
}); 

ほら、あなたは今、IE7とIE8で角を丸めています。

Answer 5

私は結局、fancyBox v2でこれを動作させました。私のアプローチはuser1167656のアプローチに基づいていた（感謝！）：

はIE < 9のためにあなたのサイトにプラグインのCSS3 PIEプラグインjsのバージョンを追加します。

<!--[if lt IE 9]> 
<script type="text/javascript" src="html/script/PIE.js"></script> 
<![endif]--> 

を化粧箱にjsのコードキャッチを添付afterShowコールバックを使用して、次のコードを追加してください：

$.fancybox({ 

    <other fancyBox options here> 

    'afterShow': function(){ 
     if (window.PIE) { 
      $('.fancybox-skin').each(function() { 
       PIE.attach(this); 
      }); 
     } 
    }, 

    <other fancyBox options here> 

}); 

これは私のIE8で動作します。

チャールズ。

Answer 6

は、あなたの頭のセクションではmetaタグ

<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 

を追加してください。それはあなたの問題を解決する可能性があります。