JSFiddle - React, Tailwind, and code Playground
by bencergazda
HTML
<script src="//cdn.jsdelivr.net/jquery.slick/1.4.1/slick.min.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/jquery.slick/1.4.1/slick.css">
<!-- demonstration of Ken Wheeler's Slick.js issue #983 (https://github.com/kenwheeler/slick/issues/983) -->
<div id="slideshow">
<img src="http://placehold.it/500x645/ff9c00/000000" alt="" />
<img src="http://placehold.it/234x645/99ccff/000000" alt="" />
<img src="http://placehold.it/978x645/ff99bb/000000" alt="" />
<img src="http://placehold.it/156x645/ff9c00/000000" alt="" />
<img src="http://placehold.it/324x645/99ccff/000000" alt="" />
<img src="http://placehold.it/588x645/ff9c00/000000" alt="" />
<img src="http://placehold.it/898x645/ff99bb/000000" alt="" />
</div>
JavaScript
$('#slideshow').slick({
arrows: false,
dots: true,
infinite: true,
centerMode: true,
variableWidth: true
});