JSFiddle - React, Tailwind, and code Playground

by neo108

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/base/jquery-ui.css">
<div id="slider"></div><br />
<p>
    <label for="edit-varprice">Amount:</label>
    <input type="text" id="edit-varprice" />
</p>

JavaScript

$(function() {
    $( "#slider" ).slider({
      value: 30,
      min: 0, 
      max: 250,
      step: 1, 
      slide: function(event, ui){
        $("#edit-varprice").val(ui.value + ".00");
      }  
    });
    
    $( "#edit-varprice" ).val( $( "#slider" ).slider( "value" ) + ".00");
  });