[jQuery]Slickで自動スライドショー

jQuery
スポンサーリンク

jQuery

<script src="slick-1.8.1/slick/slick.min.js"></script>
<script>
$(function(){
  $('.slide').slick({
    arrows: false,
    autoplay: true,
    dots: false,
    infinite: true,
    speed: 4000,
    slidesToShow: 5,
    slidesToScroll: 1,
    centerMode: false,
    variableWidth: true,
    cssEase:'linear',
    swipe: false,
    draggable: false,
  });
});
</script>

HTML

<link rel="stylesheet" href="slick-1.8.1/slick/slick-theme.css">
<link rel="stylesheet" href="slick-1.8.1/slick/slick.css">

<div class="slide">
  <div class="slide_img" style="background-image:url('slide1.jpg')"></div>
  <div class="slide_img" style="background-image:url('slide2.jpg')"></div>
  <div class="slide_img" style="background-image:url('slide3.jpg')"></div>
  <div class="slide_img" style="background-image:url('slide4.jpg')"></div>
  <div class="slide_img" style="background-image:url('slide5.jpg')"></div>
</div>

コメント

タイトルとURLをコピーしました