4PXMMenu

JavaScript

滑らかなアニメーションでモバイルサイトに最適なメニュー実装「4PXMMenu」

4PXMMenuはモバイルサイトに最適なメニューを実装することができるjQueryプラグインです。滑らかでさりげなく、美しいアニメーションでメニューを表示させることができます。モバイルサイトで使用するメニューを探している人は要チェックです。

4PXMMenu

デモ

デモページではブラウザ幅を768pxより小さくしないとメニューが表示されないようになっているので、画面にメニューがでていない場合はブラウザ幅を縮小してモバイル版に切り替える必要があります。

メニューの表示は、画面右上にハンバーガーアイコンとして表示されます。このアイコンをクリックすると、左から滑らかなスライドアニメーションとともにメニュー画面が表示されます。

また、それと同時にハンバーガーアイコンが「×」に変化します。このアイコンの変化もアニメーションで行われるので、とても素敵です。「×」をクリックすれば、メニューがスライドアニメーションとともに非表示になり元の状態に戻ります。

シンプルなメニューですが、さりげないアニメーションがとても優雅に感じて違和感なくメニューの表示・非表示が行えますね。使い方もカンタンなので、手軽に実装できるところもグッドです。

というわけで、モバイルサイトに活用したい滑らかなアニメーションによるメニューを実装できるjQueryプラグイン「4PXMMenu」のご紹介でした。

4PXMMenu

jQuery Countdown手軽に使えるカウントダウンタイマーを実装できる「jQuery Countdown」前のページ

シンプルでレスポンシブ対応のカッコイイ通知を表示できる「Notyf」次のページNotyf

関連記事

  1. Tabby

    JavaScript

    軽量でシンプルなタブメニューを実装できるjQueryプラグイン「Tabby」

    とても軽量でシンプルなタブメニューを実装できるjQueryプラグイン「…

  2. Inspiration for Grid Loading Animations
  3. Tilt Hover Effects

    JavaScript

    ホバーによるチルトエフェクトを実装できる「Tilt Hover Effects」

    指定したアイテムにホバーすることでオシャレなチルトエフェクトを実装する…

  4. SweetAlert
  5. Simple Sidebar
  6. Pagination.js

    JavaScript

    シンプルでさまざまなカスタマイズが可能な「Pagination.js」

    Pagination.jsはシンプルでさまざまなカスタマイズが可能なペ…

最近の記事

  1. 冬用のふとん
  2. 田沢湖
  3. ゴムの耳栓
  4. ライオンコーヒー(バニラマカダミア)
PAGE TOP