Material Menuはサイドからスライド開閉するレスポンシブ対応のメニューを実装することができるjQueryプラグインです。デモでは開閉するパネルはシンプルなデザインですが、パネル下にシャドウがついたりとちょっとした立体感を感じさせる作りになっています。
[ads_center]
Material Menu
以下はMaterial Menuの実際のデモになります。
ブラウザの幅を縮めていき下へスクロールして行くと、メニューがアイコンに切り替わります。
アイコンをクリックすると左からメニューがスライドオープンしてきます。パネルが開かれている状態でパネルの外をクリックするとメニューがクローズします。
モバイル時にメニューアイコンに切り替わった時はメニューパネルが隠れているので、コンテンツの邪魔になりません。
開閉するアニメーションもスッと横から出てくるのでほとんどストレスを感じさせないところがいいですね。
というわけで、スライド式のナビゲーションメニューを実装したい時に覚えておきたいjQueryプラグインでした。