JSFiddle - React, Tailwind, and code Playground
HTML
<div class="slider"></div>
<br />
<div id="slider-result"></div>
JavaScript
$(".slider").slider({
animate: true,
range: "min",
value: 0,
min: -100,
max: +100,
step: 1,
slide: function(event, ui) {
$("#slider-result").html(ui.value>0?'+' + ui.value:'' + ui.value);
//this updates the hidden form field so I can submit the data using a form
if($(this).attr("id") == "one")
$("#hidden1").val(ui.value);
}
});