no-image

JavaScript

水平・垂直に対応したカルーセルスライドショー「jCarousel」

jCarouselは水平・垂直に対応したカルーセルスライドショーを実装できるjQueryプラグインです。スライドショーのナビゲーションがカルーセルのようになっているのが特徴です。セッティング次第でレスポンシブやAjaxによる読み込みなどにも対応できるので、カスタマイズ性にも優れています。

jCarousel

デモ

デモにはベーシックなものからレスポンシブに対応したもの、Ajaxを使用したもの、垂直タイプのカルーセルなどいくつかの種類が用意されています。

Basic carouselでは前後に切り替えできる左右矢印ボタンが設置されたスライダーが表示されています。スライダーの左下には数字が書かれたナビゲーションボタンが設置されていて、ここから特定のコンテンツへピンポイントで移動できます。アニメーションは横にスライドされます。

逆にVertical carouselでは縦にスライドアニメーションします。

水平・垂直に対応したスライドアニメーションができるほか、レスポンシブにも対応させたりAjaxでコンテンツを読み込ませたりと、カスタマイズ次第でいろいろなタイプのスライドショーを作れるので、気になる方はぜひチェックしてみてください。

jCarousel

関連記事

  1. jQuery RS Carousel

    JavaScript

    レスポンシブ対応のシンプルなカルーセルを実装できる「jQuery RS Carousel」

    レスポンシブ対応のシンプルなカルーセルを実装できるjQueryプラグイ…

  2. TabTab.js

    JavaScript

    アニメーション付きで切り替わるjQueryのタブプラグイン「TabTab.js」

    TabTab.jsは素敵なアニメーション付きのタブコンテンツを実装する…

  3. ShowMore.js

    JavaScript

    長いコンテンツを折りたためるjQueryプラグイン「ShowMore.js」

    ShowMore.jsは長いコンテンツを折りたたんで表示・非表示を簡単…

  4. Uglipop.js

    JavaScript

    軽量でミニマルなモーダルボックスを実装できる「Uglipop.js」

    Uglipop.jsは軽量でミニマル、カスタマイズ性にも優れたモーダル…

  5. Random Quote Machine

    JavaScript

    ランダムにテキスト(クオート)を表示させる「Random Quote Machine」

    Random Quote Machineは、設定したデータのなかからラ…

  6. SuperEmbed.js

    JavaScript

    さまざまな埋め込み動画をレスポンシブで表示できる「SuperEmbed.js」

    SuperEmbed.jsは、さまざまな埋め込み型の動画をレスポンシブ…

最近の記事

  1. KMC-80BK
  2. 味噌ラーメン〜旨辛にんにく味噌〜
  3. STP-XH70
  4. 久保田城

Instagram始めました

Facebookページ

PAGE TOP