JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://kenwheeler.github.io/slick/slick/slick.js"></script>
<link rel="stylesheet" href="https://kenwheeler.github.io/slick/slick/slick.css">
<div class="slick single-item">
<div><h3>1</h3></div>
<div><h3>2</h3></div>
<div><h3>3</h3></div>
<div><h3>4</h3></div>
<div><h3>5</h3></div>
<div><h3>6</h3></div>
</div>
JavaScript
function slickify(){
$('.slick').slick({
autoplay: true,
autoplaySpeed: 4000,
delay: 5000,
speed: 700,
responsive: [
{
breakpoint: 500,
autoplay: true,
autoplaySpeed: 4000,
delay: 5000,
speed: 700,
},
{
breakpoint: 1920,
settings: "unslick"
}
]
});
}
slickify();
$(window).resize(function(){
var $windowWidth = $(window).width();
if ($windowWidth > 500) {
slickify();
}
});