Lighting
このJavaScriptは2001年3月に発売された著書「わたしにもできる動くホームページ」に収録したものです。Internet Explorer 4の頃に作成したものであるため、そのうちjQuery用にしてもっとシンプルな実装で作成するかもしれません。
指定した要素を発光させるアニメーションを実現するためのDynamicHTML(DOM+JavaScript)です。Visual Filterのglow処理を利用しているので、WindowsのInternet Explorer専用なり。スクリプトはscriptフォルダにあるものとして記述しています。
Sample
結構ビジュアル効果があります
<DIV id="light" style="width:100%; color:red; font-size:40px; font-weight:bold; filter:glow(color=orange,strength=0)">結構ビジュアル効果があります</DIV>
ID名は自由ですが、スクリプトの実行時に必ず指定したID名を使用してください。Color=#rrggbb(colors)で発光する色を変更できます。DIV要素には何を入れておいてもかまいません。
Visual Filterは、<DIV>内で指定してください。また、必ずstyle属性でwidth(横幅)を指定しなければなりません。position:absoluteを指定しておけば横幅を指定しなくても大丈夫です。
<SCRIPT type="text/javascript" src="script/lighting.js"></SCRIPT>
ここからスクリプトをファイルに保存して、<HEAD>~</HEAD>内に記述してスクリプトを読み込ませます。
<BODY onload="lighting('light');">
スクリプトは<BODY>のonload属性で実行します。
※当時と比べて文字の輪郭が汚くなっているのはブラウザやDirectXのバージョンによる違いなのか、それともClearTypeの副作用だったりするのだろうか?