offcanvas-mobile-menuは、シンプルでモバイルフレンドリーなナビゲーションメニューを実装することができるjQueryプラグインです。横からスライドアニメーションでメニューが表示・非表示されます。
offcanvas-mobile-menu
offcanvas-mobile-menuのダウンロードや詳細な使い方は、以下のページからチェックできます。ダウンロードしたファイルから実際のデモ動作も確認できます。
デモでは画面右上に「trigger menu」と書かれたボタンが設置されていて、ここをクリックすると右側からナビゲーションメニューがスライドアニメーションとともに表示されます。
再度、trigger menuボタンをクリックすると、今度はメニューがスライドアニメーションとともに非表示になる仕組みです。
ユーザーによるアクションがないとメニューが表示されないので、通常時は画面全体がスッキリしますね。アニメーションも無駄な動きがなく、サッと表示・非表示されるのでストレスない操作性を実現しています。
また、マークアップや使い方もとてもシンプルなので手軽に実装できるのがグッドです。
オプションには、menuTrigger、position、speed、widthの項目が用意されています。シンプルながらも、オプションによるちょっとしたカスタマイズが可能です。
というわけで、モバイルフレンドリーなナビゲーションメニューを実装したい人は、ぜひ「offcanvas-mobile-menu」を活用されてみてはいかがでしょうか？
