JSFiddle - React, Tailwind, and code Playground

by olex

HTML

<script src="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js"></script>
<link rel="stylesheet" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css">
  <div class="slk">
    <div><span>1</span></div>
    <div><span>2</span></div>
    <div><span>3</span></div>
		<div><span>4</span></div>
		<div><span>5</span></div>
		<div><span>6</span></div>
  </div>

CSS

.slk {width: 400px; border: 1px solid red;}
.slk span {display: block; margin: 5px; padding: 15px 25px; background: #ddd; font-size: 32px; text-align: center;}

JavaScript

$(document).ready(function(){
      $('.slk').slick({
				slidesToShow: 5,
  			slidesToScroll: 1,
				infinite: true,
				autoplay: true,
				arrows: false,
				variableWidth: true
      });
    });