PgwSlider

JavaScript

レスポンシブで軽量なスライダーを実装できるjQueryプラグイン「PgwSlider」

PgwSliderというjQueryプラグインを使えばレスポンシブで軽量なスライダーを実装することができます。実際のデモではサムネイルのナビゲーションがサイドに並んでおり、画面を縮小(モバイル時)するとサムネイルが下部に移動します。フェードで切り替わっていくアニメーションが美しいですね。

[ads_center]

PgwSliderの使い方

PgwSlider

PgwSlider

使い方もシンプルでわかりやすいです。

$(document).ready(function() {
    $('.pgwSlider').pgwSlider();
});

オプションで自動スライドの設定やトランジション、またはインターバルのスピードなんかを調整することができます。

レスポンシブなスライダーを実装したい時の選択肢の1つとしていかがでしょうか。

関連記事

  1. TextFit

    JavaScript

    テキストをコンテナ幅にすばやくフィットさせる「TextFit」

    TextFitは、一行または複数行のテキストをコンテナ幅(オプションに…

  2. jquery-time-slider

    JavaScript

    時間と日付を選択できる「jquery-time-slider」

    jquery-time-sliderは時間と日付を選択できるjQuer…

  3. Bricklayer

    JavaScript

    軽量なグリッドレイアウトを実装できる「Bricklayer」

    Bricklayerは軽量なグリッドレイアウトを実装することができるラ…

  4. JavaScript

    テキストの一部分をサラっとアニメーションさせるjQueryプラグイン「dynamo.js」

    テキストで指定した一部分をサラっとアニメーションさせるjQueryプラ…

  5. Stretchy

    JavaScript

    入力した文字数に合わせて可変するフォーム実装「Stretchy」

    Stretchyは入力した文字数に合わせてボックスが伸び縮みするフォー…

  6. PleaseWait

    JavaScript

    ローディングアイコンをオシャレに実装することができる「PleaseWait」

    PleaseWaitはローディングアイコンをオシャレに見せることができ…

最近の記事

  1. macOS Mojaveのダークモード
  2. Olli
  3. 単語帳メーカー(Flashcard Maker App)
  4. 1Password 7

Facebookページ

PAGE TOP