JSFiddle - React, Tailwind, and code Playground

by Guruprasad Rao

HTML

<p>
  <label for="amount">Value:</label>
  <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
 
<div id="slider-range" style="height:250px;"></div>

JavaScript

$(function() {
      $( "#slider-range" ).slider({
            orientation: "vertical",
            range: false,
            value:20,
            slide: function( event, ui ) {
                 if (ui.value < 20)  // corrected
                    return false;
                else
                    $( "#amount" ).val( ui.value );
                
            }
      });
    $( "#amount" ).val( $( "#slider-range" ).slider( "value" ) );
});