今日、彼のRSSフィードで、対立.pngとIEに関する別の記事へのリンクを見つけました。 おそらく、彼女はそれを受け入れたのです。上の見出しを驚かせた人々の大部分がそうでした-偏見を持って(彼らは再び25と言います)。 それにもかかわらず、多くの興味深いことが判明しました。 たとえば、今ではbackground .pngは
background-position
および
background-repeat
プロパティに完全に依存しています。
すぐに私はすべての好奇心を例と説明とともにページに送ります。 すべてがJavaScriptを使用して実装され、必要なページ要素<DD_belatedPNG:rect />が作成され、割り当てられます(つまり、VMLでは.pngが「リボーン」されます)。
動作するには、次のものが必要です。
- JavaScriptをダウンロードしてHTMLドキュメントに接続します(例のあるページには、通常ファイルと圧縮ファイルへの2つのリンクがあります)。
- HTMLドキュメント内で、関数( DD_belatedPNG.fix() )を実行します。この関数は、パラメーターとして、 riteを操作する要素のセレクターを渡す必要があります
例:
<!-[IE 6の場合]> <script type = "text / javascript" src = "DD_belatedPNG.js"> </ script> <script type = "text / javascript"> DD_belatedPNG.fix( '。Png_bg、.other_class'); //接続クラスの例 </ script> <![endif]->
何がそんなに特別なの?
- 他の修正とは異なり、AlphaImageLoaderを使用しないため、レイヤーの順序に混乱が生じません(フィルターの適用後のz-indexの変更)。
- 上記のように、現在CSSプロパティの
background-repeat
およびbackground-position
機能します。 - 同時に、 element.styleを介した要素のスタイルへのアクセスと擬似クラスの操作がサポートされています:hover ;
- 控えめなスクリプトの重み-圧縮形式で4 KB。
短所:
- VMLを1つまたは別のDOMノードに割り当てる機能によって課せられる制限のため、セレクターとして
<body>
を指定することはできません。 -
background-position:fixed
プロパティの動作はテストされていません。 -
IEの「背景」のトリックに苦労しているスクリプトであるため、タグ内に半透明の.pngを表示するのに役立ちません;
- スクリプトは、テーブル
<tr>
および<td>
の要素では機能しません。
一般に、スクリプトはかなり粗雑です。 最初のテストはわずか3日前にリリースされました。 したがって、追加のバグが表示される場合があり、スクリプトは必要以上にリソースを消費します。 それでも、ドリューディラー( ドリューディラー 、脚本の著者の名前)が作ったものは多くの人にとって興味深いものになると思うので、この短いメモを書きました。
UPD スクリプトの3番目のバージョンがリリースされ、いくつかの欠点が修正されました。 左と上の単一ピクセルのインデント、不要な境界線の外観、スクロール、およびコンマで区切られた複数のセレクターに関数を渡す機能を含みます(上記のコード例を参照)。