JavaScript

紙のようなエフェクトのスライダーを実装できるjQueryプラグイン「Paper Slider」

Paper SliderというjQueryプラグインを使えば、紙のようなエフェクトのシンプルなスライダーを実装することができます。1枚ずつ紙を前から後ろへ入れ替えていくようなスライドをします。実際のデモでは前後に移動できる矢印もついているので便利ですね。

[ads_center]

Paper Sliderの使い方

こんな感じのシンプルなスライダーを実装できます。

Paper Slider

$(document).ready(function() {
    var as = $('#papers').paperSlider()
})

オプションには、スピード、タイマー、オートスライダーの有無、ホバーで停止するかどうかなど、カスタマイズできる項目が色々あります。

ちょっと珍しい感じのスライダーなので、一般的なスライダーでは物足りないって時に活用してみてはいかがでしょうか。

Paper Slider

関連記事

  1. jquery-scrollstop

    JavaScript

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

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

  2. chalk-animation

    JavaScript

    カラフルなアニメーションを実装できる「chalk-animation」

    chalk-animationはカラフルなアニメーションによるテキスト…

  3. Micromodal.js

    JavaScript

    アクセシブルで軽量なモーダルダイアログを実装できる「Micromodal.js」

    Micromodal.jsは、アクセシブルでファイル容量も軽量なモーダ…

  4. JavaScript

    JavaScriptでセレクトボックスから項目を選択したらリンク先にジャンプさせるやり方

    ちょっとした備忘録です。よく見るセレクトボックスから各項目を選択するだ…

  5. Priority Nav Scroller

    JavaScript

    水平スクロールができるナビゲーション「Priority Nav Scroller」

    Priority Nav Scrollerは水平スクロールを備えたナビ…

最近の記事

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

Facebookページ

PAGE TOP