PgwSlider

JavaScript

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

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

[ads_center]

PgwSliderの使い方

PgwSlider

PgwSlider

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

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

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

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

関連記事

  1. jquery.square.js

    JavaScript

    スクエアなグリッドレイアウトを実装できる「jquery.square.js」

    jquery.square.jsは、スクエアなグリッドレイアウトを実装…

  2. HR Navigation Responsive Menu
  3. JavaScript

    Lightbox風のjQueryプラグインColorBoxの使い方

    綺麗なイメージギャラリーを簡単に設置できるColorBoxの使い方の紹…

  4. syncscroll

    JavaScript

    2つ以上のスクロールエリアを同時にスクロールできる「syncscroll」

    syncscrollは2つ以上のスクロールエリアを同時にスクロールでき…

  5. Rate Yo!

    JavaScript

    星評価(レーティング)を簡単に実装できるjQueryプラグイン「Rate Yo!」

    Rate Yo!というjQueryプラグインを使えば、SVGを使った星…

最近の記事

  1. 田沢湖
  2. ハクバ シリコンクロス
  3. トライポッドスリーブ
  4. レンズペン3 ミニプロとレンズペン ELITE マイクロプロ

Instagram始めました

Facebookページ

PAGE TOP