jQuery Navobile

JavaScript

横スライドが素敵!レスポンシブ対応モバイルナビゲーション「jQuery Navobile」

jQuery NavobileというjQueryプラグインを使えば、レスポンシブに対応したモバイルナビゲーションを実装することができます。モバイル時のナビゲーションでは、メニューアイコンをクリックすると横からスライド表示されます。とても実用的でよさそうですね。

[ads_center]

jQuery Navobileの使い方

以下はPC閲覧時の場合です。

PC閲覧時

スマホなどのモバイル時のブラウザサイズでは以下のようなナビゲーションに切り替わります。

モバイル時

メニューアイコンをクリックすると、こんな感じでナビゲーションが横からスライドで表示されます。

横からスライドで表示

使い方もシンプルそうでいいですね。

$('#navigation').navobile();

オプションもcta、content、easing、bindSwipe、bindDragといった色んな項目が用意されています。

jQuery Navobile

関連記事

  1. jqueryIntroLoader
  2. jquery-scrollstop

    JavaScript

    スクロールの開始・終了時のイベントを設定できる「jquery-scrollstop」

    jquery-scrollstopはスクロールの開始・終了時のイベント…

  3. BigText

    JavaScript

    テキストを指定した幅にフィットさせるjQueryプラグイン「BigText」

    BigTextは、テキストの行を、指定した幅にフィットさせるために必要…

  4. no-image

    JavaScript

    Lightboxスタイルのギャラリーやカルーセルを実装できる「slideBox.js」

    slideBox.jsはレスポンシブに対応したLightboxスタイル…

  5. no-image

    JavaScript

    カスタマイズ性の高いjQueryアラート・モーダル・lightboxプラグイン「jAlert」

    jAlertはカスタマイズ性の高いjQueryアラート・モーダル・li…

  6. JavaScript

    指定したボックス要素にドロップシャドウをつけてくれるjQuery Shadow Plugin

    指定したボックス要素にドロップシャドウをつけてくれるjQuery Sh…

最近の記事

  1. ブラジルイパネマ
  2. 梅しば
  3. BM-IBCDH13RD
  4. 雪
  5. ホットのドリップ

アーカイブ

PAGE TOP