no-image

JavaScript

軽量・高速でレスポンシブ対応のjQueryスライダー「partialViewSlider」

partialViewSliderは左右にスライドする軽量・高速でレスポンシブに対応したjQueryスライダーです。キーボードによる操作も可能なほか、豊富なオプションでカスタマイズ性にも優れています。

partialViewSlider

デモ

デモでは左右に矢印ボタンが設置されたイメージスライダーが表示されます。スライダー両端にある矢印ボタンから画像を前後移動できるほか、キーボードの左右矢印キーからでも操作を行うことが可能です。

また、レスポンシブにも対応しているので画面幅を縮小・拡大することで、そのサイズに合わせてスライダーのサイズも変化します。パソコンをはじめスマホやタブレットのモバイルからでも快適に閲覧できるのがいいですね。

自動再生やキーボードなどの有効・無効のセッティングはオプションから手軽に設定可能です。主なオプション項目は、width、controls、controlsPosition、backdrop、dots、auto、transitionSpeed、delay、pauseOnHover、keyboard、perspective、prevHtml、nextHtmlです。

そのほか、イベントやメソッドの設定も行えます。

というわけで、軽量でレスポンシブにも対応したスライダーを実装できる「partialViewSlider」の紹介でした。

関連記事

  1. Letter by Letter JS

    JavaScript

    美しいフェードでテキストが徐々に表示されていく「Letter by Letter JS」

    Letter by Letter JSは美しいフェードでテキストを徐々…

  2. Rythim.js

    JavaScript

    音楽のリズムに合わせてボタンなどに躍動感を与える「Rythim.js」

    Rythm.jsは、あなたのホームページに躍動感を与えてくれるjsライ…

  3. Materialize Tags

    JavaScript

    マテリアルデザインのタグ管理を実装できる「Materialize Tags」

    Materialize Tagsは、マテリアルデザインのタグ管理を実装…

  4. Circliful

    JavaScript

    円グラフで統計情報を伝えたい時に役立つjQueryプラグイン「Circliful」

    CirclifulというjQueryプラグインを使えば、統計情報を伝え…

  5. FakeLoader.js

    JavaScript

    フルスクリーンでカッコいいローディングアニメーション・FakeLoader.js

    FakeLoader.jsはフルスクリーンでカッコいいローディングアニ…

  6. A simple jQuery Accordion with unlimited nesting

    JavaScript

    シンプルなアコーディオンを実装する「A simple jQuery Accordion with u…

    シンプルで見やすいアコーディオンを実装することができる「A simpl…

最近の記事

  1. 久保田城
  2. ハードサイド CS80
  3. ACC-TRBX
  4. ピスタチオ クリスマス ツリー フラペチーノ

Instagram始めました

Facebookページ

PAGE TOP