DesignWalkerDesignWalkerロサンゼルスで働くウェブデザイナーの日記。3件のコメントウェブデザインには欠かせないリンク要素。今回は、そんなマウスオーバーをデザインするアイデアをいくつかまとめてみました。Pelletierマウスオーバーすると、オブジェクトが浮かび上がり、反射や影の部分も小さくなります。リアルなエフェクトですね。Trickメニューにマウスオーバーすると、選択されていないメニューにはぼかしがかかります。おもしろいアイデアですね。jQueryメニューにマウスオーバーすると、色がフェードインしてくるメニューです。methodボタンにマウスオーバーすると、フェードインされてONが浮き上がってきます。マウスアウトでフェードアウトします。Menuマウスオーバーで手描き風メニューにエフェクトがかかります。Animationsマウスオーバーでメニューがアニメーション。動きが軽快で気持ちいいです。Buttonマウスオーバーでボタンが押し込まれたイメージに切り替わります。Demonstrationマウスオーバーしているメニューがハイライトされます。マウスを他のメニューにスライドすると、ハイライトがアニメーションでついてきます。jQueryマウスオーバーでメニューが右側にスライドします。シンプルですがわかりやすいメニューになりそうですね。Pluginメニューにマウスオーバーすると、サブメニューがスライドして表示されます。他のメニューにマウスオーバーすると開いているメニューが閉じられます。Plug-inボックスにマウスオーバーすると、そのボックスが下方向に拡大されます。メニューに使えそうです。jquery-glowテキストにマウスオーバーするとテキストカラーがフェードします。マウスアウトでフェードアウトしてくれます。effectCSSで簡単にマウスオーバーをデザインできるサンプルが紹介されています。pluginテーブルのカラムにマウスオーバーするとカラムをハイライトしてくれます。スペック表などに使えそう。jQueryサムネイル画像にマウスオーバーすると画像を拡大してポップアップしてくれます。Hover画像にマウスオーバーすると複数のテキストリンクのボックスを表示してくれます。effectボックスにマウスオーバーするとボックスがハイライトされます。使い道がありそうですね。jQueryギャラリーやポートフォリオ系のサイトに便利なのではないでしょうか。画像にマウスオーバーすると詳細がスライドしてきます。effectこちらもイメージにマウスオーバーすると詳細が表示されます。Examplesマウスオーバーをうまくデザインに組み込んでいるウェブサイトをまとめられています。コメントをキャンセルメールアドレスが公開されることはありません。アメリカの最新ウェブ事情や働き方、ウェブマーケティングなどについて書きます。