Contents1 jQueryプラグイン「Owl Carousel 2」を使ってカルーセル／スライダーを設定する方法1.1 ダウンロード1.2 導入方法1.2.1 CSSファイルインクルード1.2.2 JSファイルインクルード1.2.3 HTML定義1.2.4 プラグイン呼び出し1.3 HTMLコード1.3.1 オプションなし1.3.2 オプションあり1.4 デモ1.5 オプション1.5.1 items1.5.2 margin1.5.3 loop1.5.4 center1.5.5 autoWidth1.5.6 startPosition1.5.7 nav1.5.8 navText1.5.9 navElement1.5.10 rewind1.5.11 dots1.5.12 autoplay1.5.13 autoplayTimeout1.5.14 autoplayHoverPause1.5.15 autoplaySpeed2 ご参考2.1 関連ページ jQueryプラグイン「Owl Carousel 2」を使ってカルーセル／スライダーを設定する方法 ダウンロード まず、「Owl Carousel 2」のサイトに行って、書庫ファイルをダウンロードしてください。 Owl Carousel 2 トップページに「Download」ボタンがあるので、クリックすると書庫ファイルをダウンロードできます。 ダウンロードしたファイルを解凍すると、以下のようなファイルが展開されます。 導入方法 Installation CSSファイルインクルード まず、CSSファイルを読み込みます。 ダウンロードし解凍した書庫ファイルの中の「dist」→「assets」の下にある「owl.carousel.css」「owl.theme.default.css」または、「owl.carousel.min.css」「owl.theme.default.min.css」をリンクしてください。 <link rel=”stylesheet” href=”/assets/OwlCarousel2-2.3.4/dist/assets/owl.carousel.min.css”> <link rel=”stylesheet” href=”/assets/OwlCarousel2-2.3.4/dist … 続きを読む jQueryプラグイン「Owl Carousel 2」を使ってカルーセル／スライダーを設定する方法