2012-03-31 28 views
2

Internet Explorerでサイトを表示しているときにdivの不透明度に問題があります。 Raphael 2.0を使用した(非縮小さ)私は、次のコード使用して矩形を作成します。私のCSSファイルでIEでRaphaelの不透明度が表示されない

var rIn = Raphael("myDiv", "100%", "100%"); 
rIn.rect(0, 0, "100%", "100%").attr({fill:"black", stroke:"none", opacity:0.6}); 

私はopacityタグを用いた透明のdivを持っている場合は、私もそれがIEのため正常に動作するようfilterを含ん書きます。

opacity:0.6; filter: alpha(opacity = 60); 

しかし、ラファエルは、プロパティとしてfilterを許可するように表示されませんので、この長方形はまったく表示されません。これはIE上の問題です - FF/Chrome/SafaraiのWin/Macで問題なく動作します。

答えて

2

filterはIE5-7でのみ動作します。 IE8をサポートするために、あなたにも前に、あなたのfilterプロパティこのプロパティを必要とする:

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; 

これQuirksMode articleは、同様にあなたを助ける必要があります。


実際に、クラスを試してみてください。

.opacity60 { 
    opacity: 0.6; 
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; 
    filter: alpha(opacity=60); 
} 

そしてsetAttribute('class', 'opacity60')呼び出しを介してopacity60にあなたの四角形のクラスを設定します。

+0

ありがとう@Blender。 Raphael属性にも同様のプロパティを使用できますか? – djq

+0

クラスをRaphaelオブジェクトに追加します。 – Blender

+0

'.css'でクラスを宣言し、次の' rIn.rect.setAttribute( 'class'、 'opacity60') 'を使って属性を設定しようとしましたが、IEで次のエラーメッセージが表示されます:' SCRIPT438:Object doesn 'setAttribute'' – djq

関連する問題