フルスクリーンナビゲーションを表示できるハンバーガーメニュー実装「jQuery_Overlay_Menu」

jQuery_Overlay_Menu

jQuery_Overlay_Menuは、フルスクリーンによるナビゲーションを表示させるハンバーガーメニューを実装できるjQueryプラグインです。スタイリッシュなオーバーレイによるかっこいいフルスクリーンナビゲーションを取り入れたい人は要チェックです。

jQuery_Overlay_Menu

jQuery_Overlay_Menu

デモでは画面左上にハンバーガーメニューが表示されており、ここをクリックすると上からスライドダウンしながらオーバーレイによるフルスクリーンナビゲーションが表示されます。

ナビゲーションメニューが表示されているときは、ハンバーガーアイコンが「×」印に切り替わります。再度ここをクリックすると、今度はスライドアップで通常画面に戻ります。それと同時に、「×」印もハンバーガーアイコンに戻ります。

ナビゲーション開閉のアニメーション動作がわりと速めなので、さくさくとストレスなく表示・非表示できるのがいいですね。

また、デモはレスポンシブにも対応しているので画面幅を縮小してもそれに合わせて最適化されます。

ハンバーガーメニューのアイコンをクリックしないとナビゲーションメニューが表示されないので、Webサイトのデザインやレイアウトをスッキリさせたいという人には最適ですね。

難しい設定もなく機能性がシンプルな分、とても軽量なプラグインに仕上がっています。

というわけで、シンプルでスタイリッシュなフルスクリーンナビゲーションを表示するハンバーガーメニュー「jQuery_Overlay_Menu」のご紹介でした。

スポンサーリンク

スポンサーリンク

アクセスランキング

Tags

Archives