Slyder

JavaScript

レスポンシブ対応のスライダーナビゲーションを実装できる「Slyder」

Slyderはレスポンシブに対応したスライダーナビゲーションを実装できるjQueryプラグインです。下(または上)の階層にあるメニューへ行くとスライドで表示されます。サクサク動作するので、スピード感を演出するナビゲーションをつくりたいときなどに活用してみてはいかがでしょうか。

スライドでサクサクとメニューを見れる

デモ

Getting startedというメニューにあるQuestion 1〜3の各項目のいずれかをクリックすると、スライドで子メニューが表示されます。このようにどんどんスライドしながら下の階層にあるメニューへ行くことができます。逆に、上の階層へもどるときもスライドされます。

たくさんあるメニューもスッキリ整理されるし、サクサク目的のメニューを探せるのでストレスも少なそうですね。

使い方も非常にシンプルなところがグッドです。気軽にスライドナビゲーション実装できると思います。

また、オプションには、back、current、hidden、item、link、wrapperといったものが用意されています。ちょっとしたカスタマイズもできて、とても便利です。

というわけで、レスポンシブに対応したスライダーナビゲーションをサクッと取り入れたい人は、ぜひ使われてみてはいかがでしょうか。

Slyder

関連記事

  1. Enllax.js

    JavaScript

    軽量で簡単なパララックスを実装できるjQueryプラグイン「Enllax.js」

    Enllax.jsは軽量で使い方も簡単なパララックスエフェクトを実装す…

  2. no-image

    JavaScript

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

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

  3. jQuery Slideshow

    JavaScript

    シンプル・軽量・レスポンシブなスライダー実装「jQuery Slideshow」

    jQuery Slideshowはシンプルで軽量、そしてレスポンシブに…

  4. no-image

    JavaScript

    ウィークデイ(週)のオプションを作成できる「jquery-weekdays」

    jquery-weekdaysはウィークデイ(週)のオプションを作成で…

  5. jQuery Equal Height

    JavaScript

    異なる要素の高さを揃えてくれる「jQuery Equal Height」

    jQuery Equal Heightは、異なる要素の高さをキレイに揃…

  6. Circular Slider

最近の記事

  1. Anker PowerPort Atom PD 4
  2. USB-2H401BKN
  3. Dyson Pure Cool Me
  4. ルック セレクション

アーカイブ

PAGE TOP