Animated Toggle Menu

JavaScript

シンプル・軽量で使い方も簡単なハンバーガーメニュー実装「Animated Toggle Menu」

Animated Toggle Menuは、シンプルでファイル容量も軽量、そして使い方も簡単なハンバーガーメニューを実装することができます。さりげないアニメーション付きで操作性もよく、スタイリッシュなハンバーガーメニューをWebサイトに取り入れたい人にはピッタリですね。

Animated Toggle Menu

デモ

デモでは、画面上部にハンバーガーアイコンが設置されていて、ここをクリックするとメニューが表示される仕組みです。メニュー表示中はハンバーガーアイコンはバツ印に切り替わり、背景にはオーバーレイがかかります。

バツ印をクリックすると、メニューが閉じられて元のハンバーガーアイコンに戻ります。デザイン・操作ともにシンプルでとても使いやすいメニューです。パソコンだけではなくスマホやタブレットとの相性もバッチリですね。

Animated Toggle Menu

というわけで、シンプル・軽量で手軽に実装することができるハンバーガーメニュー「Animated Toggle Menu」の紹介でした。ライセンスはMITになります。

Palette-js美しいカラーパレッドを追加できる「Palette-js」前のページ

シンプルでカスタマイズもしやすいタブパネル実装「jquery-tab」次のページno-image

関連記事

  1. Fancy Input

    JavaScript

    かっこいいエフェクトのテキスト入力を実装できる「Fancy Input」

    Fancy Inputは、かっこいいエフェクトを備えたテキスト入力を実…

  2. JavaScript

    jQueryプラグイン・2014年上半期56選まとめ

    気づいたら2014年も上半期が終わってしまいましたね。そんなわけで、2…

  3. ReadRemaining.js

    JavaScript

    記事を読むのにかかる時間を教えてくれるjQueryプラグイン「ReadRemaining.js」

    ReadRemaining.jsは記事を読むのにどのくらい時間がかかる…

  4. Jquery progress indicator on page scroll
  5. star-rating-svg

    JavaScript

    カスタマイズ性に優れたレーティング(星評価)実装「star-rating-svg」

    star-rating-svgは、SVGを使用したカスタマイズ性に優れ…

  6. Zoom Slider

    JavaScript

    ズーム機能を備えたシンプルなコンテンツスライダー「Zoom Slider」

    Zoom Sliderは奥行き感を演出したズーム機能を備えたシンプルな…

最近の記事

  1. 岩木山
  2. パーソナルパーティション

アーカイブ

PAGE TOP