jQuery
【jQuery】シンプルでクリーンなレスポンシブjQueryスライダ/カルーセルA simple and clean slider
July 5, 2018

A simple and clean sliderはシンプルでクリーンなレスポンシブのjQueryスライダーです。
slide-window
メインコンテナにスライドアイテムを含むことができます。
<div class="slide-window"> <div class="slide-wrapper" style="width: 300%;"> <!-- slide items --> </div> </div>
slide-wrapper
は第二のメインコンテナ。
<div class="slide-window"> <div class="slide-wrapper" style="width: 200%;"> <div class="slide"> <!-- slide item 1 --> </div> <div class="slide"> <!-- slide item 2 --> </div> </div> </div>
slide
に含めることができるスライドアイテム。slide-image
とslide-caption
<div class="slide"> <a href="#" target="_blank"> <div class="slide-image" style="background-image: url(img/slide1.jpg)"> </div> <div class="slide-caption"> <h2>AUTONOMY</h2> <p>Always keep the sun in your heart.</p> </div> </a> </div>
MIT