バックグラウンドリピートでIE 6で透明なPNGを使用するにはどうすればよいですか？

Question

以下のコードは、繰り返しの背景画像 "thinline.png"を持っています。その上に4つの透明PNGがあります：cardshadow.png、steel.png、startjobapplicationshadow.png、startapplication.png

私の目標は、このコードを他のブラウザを台無しにすることなくIE6で見栄えよくすることです。 IEのこの機能は広く文書化されていますが、私はそれを動作させることができませんでした。私にこれを解決するためのアイデアや例を教えてください。

ありがとうございました。 マイク

コード：

<div style="height: 333px; width: 100%; position: absolute; top: 68px; background-image:url(Resources/thinline.png); background-repeat:repeat-x; "> 
<div style="position: absolute; height: 300px; width: 215px; top: 15px; right: 50%; margin-right: -390px; z-index: 2; "> 
<img src="Resources/steel.png" style="position: absolute; top: 0px; z-index: 3;"/> 
<img src="Resources/cardshadow.png" style="position: absolute; top: 0px; margin-top: -8px; margin-left: -10px; z-index: 2"> 
<img src="Resources/startjobapplication.png" style="margin-left: -65px; position: relative; top: 258px; left: 50%; z-index: 5; display: block;"/> 
<img src="Resources/startjobapplicationshadow.png" style="margin-left: -67px; margin-top: -20px; position: relative; top: 258px; left: 50%; z-index: 4; display: block;"/> 

Answer 1

DD_belatedPNGを使用してください。

Answer 2

私はこれをテストしていませんが、あなたはthisを試してみてください。このクラスを適切な画像に適用します。

img.transparent { 
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(...); 
} 

私が利用可能IE6のコピーを持っていないので、私はこれが動作することを確認することはできません。

私はまた、thisを見つけました。これは、JSの問題を解決するようです。 もう少し読んだら、おそらく最後の解決策がそれに対処する最善の方法でしょう。

Answer 3

ディーンエドワーズのIE7をご覧ください。透明なpngが正しく機能するようにするInternet Explorer 6用のjavascriptライブラリです。また、CSSのバグを修正したり、追加のCSS機能を追加することもできます。私はこのライブラリを過去にいくつか成功させて使用しました（IE固有のCSSハックを追加するよりも簡単です）。ただし、読み込み中にページが短く間違って見えることがあります。

Answer 4

MicrosoftのAlphaImageLoaderをバックグラウンドで使用する際に問題があります。彼らは基本的に繰り返されません。

2つの解決策があります：あなたのイメージを延伸することができる場合

1. は - そしてAlphaImageLoaderで適切な設定を使用します。あなたのイメージは、あなたのようなJavaScriptのソリューションを使用する必要があります引き伸ばすことができない場合 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='path/to/file.png', sizingMethod='scale')

2. をIE PNG Fix v2.0 Alpha 3。 特定の（text/x-component）メタタイプのブラウザに送信する必要があるMicrosoftの.HTCファイルを使用しています。それ以外の場合は動作しません。背景画像の場合

Answer 5

、あなたの実際のコードにインラインスタイルを使用して、背景画像と品質の許容損失に応じて、されていない場合、あなたはGIFとPNGを保存し、

を使用することができます

* html .divclass {background-image:url(Resources/thinline.gif);} 

.divclassはdivのクラス名または#idです。

* htmlはie6の背景画像を上書きします。