jQuery Navobile

JavaScript

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

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

[ads_center]

jQuery Navobileの使い方

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

PC閲覧時

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

モバイル時

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

横からスライドで表示

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

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

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

jQuery Navobile

フリーのアイコンセットWebページやモバイルサイトで使いたいフリーのアイコンセット前のページ

シンプルなスクロールエフェクトを実装できるjQueryプラグイン「ScrollMe」次のページScrollMe

関連記事

  1. Philter

    JavaScript

    CSSのフィルターをコントロールできるjQueryプラグイン「Philter」

    PhilterはCSSのフィルターを簡単にコントロールすることができる…

  2. PIGNOSE Calendar

    JavaScript

    美しくてシンプルに使えるデートピッカー実装「PIGNOSE Calendar」

    PIGNOSE Calendarは、美しくてシンプルな操作性によるデー…

  3. no-image

    JavaScript

    フロントエンドアプリケーションを構築するためのJSライブラリ「HyperApp」

    HyperAppは、フロントエンドアプリケーションを構築するための1K…

  4. JQuery SlideShow

    JavaScript

    軽量な自動スライドショー(画像・動画)を実装できる「JQuery SlideShow」

    JQuery SlideShowは、画像・動画のスライドショーを実装で…

  5. no-image

    JavaScript

    インタラクティブなツリー機能を実装できる「jstree」

    jstreeはインタラクティブなツリー機能を実装できるjQueryプラ…

  6. Expanding Bar Navigation Concept

最近の記事

  1. そそそ 明太クリームそうめん
  2. すしざんまい
  3. 蒼龍唐玉堂 特製牛バラ担々麺
  4. サーモンアボカドサラダラップとドリップ
  5. 猿田彦フレンチ

アーカイブ

PAGE TOP