GRT Responsive Menu

JavaScript

レスポンシブ対応でモバイルフレンドリーなナビゲーションメニュー「GRT Responsive Menu」

GRT Responsive Menuはレスポンシブに対応したモバイルフレンドリーなナビゲーションメニューを実装できるjQueryプラグインです。シンプル・軽量なのでスマホやタブレットなどモバイルからの閲覧にも最適ですね。

モバイル版ではハンバーガーアイコンになる

デモ

デモではPCからのアクセスの場合、画面上部にナビゲーションメニューが横に並べられています。画面幅を縮小していくとそれに合わせてメニューのフォントサイズなどが変化します。そして特定のポイントでモバイル版に切り替わる仕組みです。モバイル版ではナビゲーションメニューがハンバーガーアイコンになり、これをクリックするとフルスクリーンでナビゲーションメニューが表示されます。フルスクリーン時には右上にバツ印が付いているので、ここから元の画面に戻ることが可能です。

画面いっぱいにナビゲーションメニューが表示されるので画面の小さいスマホなどではとても見やすく操作しやすいですね。

GRT Responsive Menu

関連記事

  1. lightgallery.js
  2. Zoomify

    JavaScript

    画像ズーム効果によるシンプルなライトボックスを実装できる「Zoomify」

    Zoomifyは、画像のズーム効果を備えたシンプルなライトボックスのた…

  3. no-image

    JavaScript

    さまざまなSVGパターンによるCSSプログレスバー「Bars」

    Barsはさまざまな種類のSVGパターンによるCSSプログレスバーを実…

  4. JavaScript

    画像をボックス単位に分割してスライドさせていくjQueryプラグイン「Maskify Slider」…

    とてもお洒落なjQueryのイメージスライダーがあったのでご紹介します…

  5. JavaScript

    ホバーすると中心から円形メニューが表示される「jQuery Wheel Menu」

    ホバーするとその地点を中心にして円形メニューが表示されるプラグイン「j…

  6. no-image

    JavaScript

    高性能なイメージビューアを実装できる「PhotoViewer」

    PhotoViewerは高性能なイメージビューアを実装できるJSプラグ…

最近の記事

  1. YAECA ワイドテーパードデニム 10-13WW
  2. ADR-3ML39シリーズ
  3. キュレル モイスチャーバーム
  4. FUJIFILM X-Pro3
  5. iPhone 11 ProとApple Watch Hermès

アーカイブ

PAGE TOP