JSFiddle - React, Tailwind, and code Playground

by dzorz

HTML

<input type="text" class="amount-assets1" />
<input type="text" class="amount-assets2" />
<div class="slider-assets"></div>

CSS

.amount-assets1,.amount-assets2{
    width: 48px;
}

JavaScript

$(function() {
        $( ".slider-assets" ).slider({
            range: true,
            min: 100,
            max: 500,
            values: [ 200, 300 ],
            slide: function( event, ui ) {
                $( ".amount-assets1" ).val( ui.values[ 0 ] + "k €");
                $( ".amount-assets2" ).val( ui.values[ 1 ] + "k €" );
            }
            });
            $( ".amount-assets1" ).val($( ".slider-assets" ).slider( "values", 0 ) + "k €" );
            $( ".amount-assets2" ).val($( ".slider-assets" ).slider( "values", 1 ) + "k €" );
    });