Javascriptで半透明

●メモ

・Javascriptで半透明にする。

ウェブページの画像やHTMLの要素ごとに透過スタイルを
指定することで半透明にできます。

しかし、ブラウザのよって指定方法が異なるので、
昔、それらを解説したサイトがないかと探しました。
参考にした英語サイトはもうないようですが、今は
あちこちに説明がありますね。

要は、

IEでは、style.filterにalpha(val)を文字列で設定、
アルファ値には０から１００までを指定
Mozilaでは、style.MozOpacityに0～1までを設定
Safari, Operaとかでは、style.opacityに0～1までを設定
※古いバージョン用に style.KhtmlOpacity にも設定

といった具合です。KhtmlOpacity( -khtml-opacity スタイル) は
独自拡張とかで、先行して実装されたもののようですね。

参考ソースコード

function setOpacity(img, val){
// IE
img.style.filter = 'alpha(opacity=' + Math.floor(val*100) + ')';
// Firefox, Netscape
img.style.MozOpacity = val;
// Chrome, Safari, Opera
img.style.opacity = val;
img.style.KhtmlOpacity = val;
}