クールに回転するJavaScriptメニュー「mooVRotatingMenu.js」
2008年07月10日-
スポンサード リンク
mooVRotatingMenu menu tournant sur lui-me gre ・mootools et au whisky
クールに回転するJavaScriptメニュー「mooVRotatingMenu.js」
マウスカーソルを合わせるとクルクル回転するメニューが作れます。


HTML的には下記のようになるみたい。
<div id="HorizMenu">
<a href="#" class="mooRotate rotateHome rotateSound"><span>Home</span></a>
<a href="#" class="mooRotate rotateMoo rotateSound"><span>Mootools</span></a>
<a href="#" class="mooRotate rotateWork rotateSound"><span>Work</span></a>
<a href="#" class="mooRotate rotateGoodies rotateSound"><span>Goodies</span></a>
<a href="#" class="mooRotate rotateFriends rotateSound"><span>Friends</span></a>
<a href="#" class="mooRotate rotateAbout rotateSound"><span>About</span></a>
</div>
サウンドを鳴らすことも出来るみたい。
回転しすぎで少し使いにくいという人もいるかもしれませんが、使いどころによっては使えるかも。
クールに回転するJavaScriptメニュー「mooVRotatingMenu.js」
マウスカーソルを合わせるとクルクル回転するメニューが作れます。


HTML的には下記のようになるみたい。
<div id="HorizMenu">
<a href="#" class="mooRotate rotateHome rotateSound"><span>Home</span></a>
<a href="#" class="mooRotate rotateMoo rotateSound"><span>Mootools</span></a>
<a href="#" class="mooRotate rotateWork rotateSound"><span>Work</span></a>
<a href="#" class="mooRotate rotateGoodies rotateSound"><span>Goodies</span></a>
<a href="#" class="mooRotate rotateFriends rotateSound"><span>Friends</span></a>
<a href="#" class="mooRotate rotateAbout rotateSound"><span>About</span></a>
</div>
サウンドを鳴らすことも出来るみたい。
回転しすぎで少し使いにくいという人もいるかもしれませんが、使いどころによっては使えるかも。
スポンサード リンク
Advertisements
SITE PROFILE
最新のブログ記事(新着順)
- 属性に値を設定するだけでパララックスアニメーションさせられる「Scroll Btween」
- スクロールで要素が迫ってくるようなエフェクトを作る「PushIn.js」
- 総数3.2万個のアイコンライブラリまとめサイト「Iconer」
- 2000個近いフリーのピクトグラムアイコン「tabler-icons」
- ページスクロールで背景ムービーが動くページが作れる「ScrollMovie」
- テキストがシャッフルされてかっこいいMENU実装
- 手書き風ピクトグラムアイコン400種「Doodle Icons」
- 色のカスタマイズやブレンドをできるオンラインツール「hue.tools」
- JSを一切使わないCSSでできたドロップダウンなどのUI実装「CSSUI」
- ダークモードにも対応したシンプルなページ作成に使える「Simple.css」
- 過去のエントリ