Real Shadow

「Real Shadow」は要素に影を付けることができるjQueryプラグインです。カーソルの位置を光源としてカーソルの動きに合わせて影も動きます。

白を基調としたデザインのサイトで映えそうですね。

サンプルを作ってみました。

簡単に影をつけることが出来るjQueryプラグイン「Real Shadow」サンプル

メニューに影をつけたり、アイコンや画像にちょっとしたアクセントを付けるときに良さそうです。

導入も簡単ですよ。


【使用方法】

まずは、コチラからZIPファイル一式をダウンロードします。そのなかにrealshadow.jsが含まれています。

次に<head>内もしくは</body>の直前にJavascriptを設定します。

以上で、影を付けるように指定した要素に対して影が適応されます。

オプションで影を付けるだけで、影を動かさないようにすることもできます。

サンプルページのソースを書いておきますので、どうぞご参考まで。

この記事と関連してると思われる記事: