概要
Windows IE 5.5, 6.0で擬似的に png 画像の半透明部分を有効ににして表示するためのスクリプトです。
説明
ソース内に
<img src="sample.png" alt="sample" width="100" height="50" />
のように png ファイルを参照している img 要素があった場合、Web ブラウザがIEのときには自動で
<img src="altpng.gif" alt="sample" width="100" height="50" style=" filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="sample.png");" />
に置き換えるための JavaScript ライブラリです。
filter は IE 独自の CSS プロパティで、背景のようなものです。
ご使用の際には altpng.gif というファイル名の透明の gif ファイルを png ファイルと同じディレクトリに置いてください。
ソースコード
/*==================================================================================================== ////////////////////////////////////////////////////////////////////////////////////////////////////// Author : http://www.yomotsu.net created: 2006/12/20 update : 2007/11/15 Licensed under the GNU Lesser General Public License version 2.1 ////////////////////////////////////////////////////////////////////////////////////////////////////// ====================================================================================================*/ var yomotsuIePng = { main : function(){ if ((typeof document.documentElement.style.zoom != "undefined")&&(typeof document.documentElement.style.msInterpolationMode == "undefined")){ var img = document.images; for (var i = 0; i <img.length; i++) { if (img[i].src.lastIndexOf(".png") != -1){ var pngSrc = img[i].src; var blankSrc = pngSrc.slice(0, pngSrc.lastIndexOf("/")+1) + "altpng.gif"; img[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + pngSrc + "')"; img[i].src = blankSrc; } } } }, addEvent : function(){ try { window.addEventListener('load', yomotsuIePng.main, false); } catch (e) { window.attachEvent('onload', yomotsuIePng.main); } } } yomotsuIePng.addEvent();
トラックバックURI
http://www.yomotsu.net/lab/javascripts/ie6png/trackback
この記事へのコメントはまだありません
コメントフォーム
実験室に戻る