【インタビュー】課題であった、UI改善やライターのモチベーションアップができました。―WingArc1st Inc.
slick本家のサイトに載っているのですが、私は知らなかったのでメモ。
やり方は簡単で、スリックのfadeのプロパティ設定をtrueにするだけでした!
|
1 2 |
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/> <script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script> |
|
1 2 3 4 5 6 7 8 9 10 11 |
<div class="fade"> <div class="slick-item"> <img src="https://kohimoto.com/labo/demo/images/slick/fonz1.png"> </div> <div class="slick-item"> <img src="https://kohimoto.com/labo/demo/images/slick/fonz2.png"> </div> <div class="slick-item"> <img src="https://kohimoto.com/labo/demo/images/slick/fonz3.png"> </div> </div> |
|
1 2 3 4 5 6 7 8 |
$('.fade').slick({ arrows: false, dots: true, infinite: true, speed: 500, fade: true, cssEase: 'linear' }); |
Web Trends Lab.編集部
KOHIMOTO Inc.所属。トレンドやノウハウ中心にWebサイトを作るための知見を現場から発信していきます👀また、制作したWebサイトでの活用法や、最前線での施策を伺う企業へのインタビューも実施予定。
PICK UP
KOHIMOTOは実用的なWebサイトを追求するWeb制作会社です。
現場から最前線のWebトレンドやノウハウなどをお届けしていきます。
