Blog

レスポンシブデザインにぴったりなカルーセルスライダー「Owl Carousel」

レスポンシブデザインが多くなってきている昨今にぴったりなカルーセルスライダーを紹介させて頂きます。

「Owl Carousel」というプラグインですが、
こちらのプラグインなにがぴったりなのかというと、
レスポンシブ対応なのはもちろんで、
タッチにも対応しており、
なんといっても一番いいのが、
オプションで、PC、ダブレット、スマホに合わせて、
アイテムの表示する数を変更出来るという点です。

他のプラグインでは、それようのオプションはなく、
自分でスクリプト書かなければいけませんでした。

幅の調整もできるので、自由度もあります。

デモがありますので、そちらをご覧下さい。

 

DEMO

設定の仕方

まずは、head内に以下のファイルを読み込みます。

そしてHTMLは、

最後、プラグインの設定は以下になります。

以上で完了です!!

ちなみに、端末毎で変えるには以下のように設定します。

オプションで様々な設定も出来ます!

オプションは以下になります。

Owl Carousel

Author Profile

Y.A

アベと申します。
ディレクター兼デザイナー兼コーダーです。
まだまだ未熟者ですが、日々頑張っています。。。

» 投稿一覧
  • Launch Cart次世代ECサイト構築システム 初期月額無料
  • LaunchMovie ECに特化した動画制作サービス

Archive

ページTOPへ