swipe-menu-jsは横からスライド・スワイプ表示するシンプルなハンバーガーメニューを実装できます。jQueryが使われていて、使い方やマークアップも簡単に記述できるので手軽に使用できるのがいいですね。
swipe-menu-js
以下のページからswipe-menu-jsの実際のデモ動作をチェックできます。
デモは全部で3つ用意されています。Menu 1（Slide menu with hover effect）、Menu 2（Slide menu with jQuery）、Menu 3（Swipe menu with jQuery）です。
どれも画面左上にハンバーガーアイコンが表示されていて、ここからナビゲーションメニューを展開できるようになっています。
Menu 1ではハンバーガーアイコンにホバーするだけでメニューが横からスライドで開かれます。閉じる場合はメニュー外にマウスを持ってくればOKです。
一方、Menu2はハンバーガーアイコンをクリックすることでメニューを開閉できるのが特徴です。この場合、メニューが開かれている場合はハンバーガーアイコンの場所がバツ印になるので、ここをクリックするとメニューが閉じます。メニューの表示・非表示はMenu 1と同様にスライドアニメーションで行われます。
Menu 3はMenu 2と同じようにハンバーガーアイコンをクリックしてメニューを開きますが、異なるのはスライドではなくスワイプ表示する点です。Menu 1とMenu 2ではコンテンツ部分にメニューが重なるかたちで表示されますが、Menu 3ではメニューが横から出てくると同時にコンテンツ部分も横へ押し出されます。
スライドかスワイプか表示方法を目的にあわせて選べるのは便利ですね。シンプルなハンバーガーメニューを実装したい人は、ぜひ「swipe-menu-js」を選択肢の一つに入れてみてはいかがでしょうか？ swipe-menu-jsの詳細やダウンロードは、以下のページからどうぞ。
