jQuery

【jQuery】jQueryを使った画像カルーセルを作成するためのプラグインBoishakh carousel

October 17, 2018
Boishakh carousel

Boishakh carouselはjQueryを使った画像カルーセルを作成するためのプラグイン。

How to use

ファイルをインクルード

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js" />
<script type="text/javascript" src="js/boishakh-carousel.js" />
<link rel="stylesheet" href="css/style.css">
$('.boishakh-carousel').boishakhCarousel();

html

<div class="boishakh-carousel">
  <div class="bc-item">
    <p>First slide content goes here</p>
  </div>
  <div class="bc-item">
    <p>Second slide content goes here</p>
  </div>
  <div class="bc-item">
    <p>Third slide content goes here</p>
  </div>
  <div class="bc-item">
    <p>Fourth slide content goes here</p>
  </div>
</div>

Available Options

使用可能なオプション

  items: 2,
  itemsBigTablet: 3,
  itemsOnTablet: 2,
  itemsOnMobile: 3,
  margin: 2,
  pauseOnHover: true,
  autoStructure: true,
  background: '#ffffff',
  prev: 'Before',
  next: 'After'