JSFiddle - React, Tailwind, and code Playground

by leongersen

HTML

<link rel="stylesheet" href="http://refreshless.com/nouislider/source/distribute/jquery.nouislider.min.css">
<script src="http://refreshless.com/nouislider/source/distribute/jquery.nouislider.all.js"></script>
<div id="slider"></div>

CSS

#slider { margin: 50px }

.noUi-horizontal { padding: 0 32px }
.noUi-handle-lower { left: -34px !important; }
.noUi-handle-upper { left: 0 !important; }

JavaScript

$("#slider").noUiSlider({ range: { min: 0, max: 100 }, start: [0,0] });