jQuery Slideout Menu

JavaScript

スライドしてメニュー表示できるjQueryプラグイン「jQuery Slideout Menu」

jQuery Slideout Menuはメニューをスライドして表示させることができるjQueryプラグインです。実際のデモではメニューアイコンをクリックするとナビゲーションメニューがスライド表示してきます。普段はメニューが隠れているので、スペースの有効活用にもつながりますね。

[ads_center]

jQuery Slideout Menu

jQuery Slideout Menu

jQuery Slideout Menu

実際のデモでは、左上、真上、右上の3カ所にメニューアイコンが表示された状態になっています。

これらをクリックするとメニューがスライドしてきます。

メニューの位置によってスライド動作が変わるのがおもしろいですね。例えば、左上のメニューは左から右にスライドしてきますし、右上のメニューは右から左にスライドしてきます。

真上にあるメニューは上から下へスライドしてくるので、その位置に合ったスライド動作を実装することができます。

デモはレスポンシブにも対応しており、画面幅によっては若干スライド位置が変わってくると思います。

普段は非表示にしておいて、クリック時に表示させるナビゲーションメニューを実装したい時には、有力な選択肢の1つになるのではないでしょうか。

関連記事

  1. shCircleLoader
  2. no-image

    JavaScript

    いろんなズーム機能を実装できるjQueryプラグイン「xZoom」

    xZoomはいろんなズーム機能を実装することができるカスタマイズ性に優…

  3. jQuery toTop()

    JavaScript

    シンプル・軽量でカスタマイズもできる滑らかなスクロール「jQuery toTop()」

    jQuery toTop()はトップへ行くための滑らかなスクロールを実…

  4. fineScroll bar

    JavaScript

    簡単に使えるスクロールバー実装「fineScroll bar」

    fineScroll barは簡単に使えるスクロールバーを実装できるj…

  5. AnimatedSlideNav

    JavaScript

    動きがオシャレなアニメーションのサイドナビゲーション「AnimatedSideNav」

    AnimatedSideNavは、動きがオシャレなアニメーションによる…

最近の記事

  1. Olli
  2. 単語帳メーカー(Flashcard Maker App)
  3. 1Password 7
  4. 風に揺れる草

Facebookページ

PAGE TOP