JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://refreshless.com/nouislider/source/jquery.nouislider.js"></script>
<link rel="stylesheet" href="http://refreshless.com/nouislider/source/jquery.nouislider.css">
<div id="uislide"></div>
<input id="field1">
<input id="field2">

CSS

#field1 {
    margin-left: 70px;
}

JavaScript

$('#uislide').noUiSlider({
    handles: 1,
    connect: false,
    range: [0,50],
    start: 20,
    step: 1,
    serialization: {
        resolution: 1,
        to: [ [ $('#field1'), $('#field2') ] ]
    },
    slide: function() {
        console.log(0)
        $('#field1').css({"margin-left": '2px'});  
    }
});