text shadow bow

CSSで影付きテキストにマウスオーバーでスポットライトを当てるサンプルが公開されています。
Safari, Firefox 3.5, Opera, Chromeでしか動きませんが、Flashを使わずに、CSSとJavaScript で実現されているのが面白い。



マウス移動でスポットライトが移動。



Text Shadow 部分が画像でなくて以下のようなタグで表現されているのも面白いところです。

<div class="wall">
<p id="tsb-text">Text Shadow</p>
<div></div>
</div>

関連エントリ

• 便利なＣＳＳテクニック３０選
• CSSとdivを使った画像先読みテクニック
• 本の目次部分のようなリストをCSSでデザインするテクニック