JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/dot-luv/jquery-ui.css">
<div class="demo">
<div id="slider"></div>
<div class='rsize'></div>
</div><!-- End demo -->
JavaScript
$("#slider").slider({
min: 0,
max: 24, // max is 24
step: 2,
slide: function(event, ui) {
var s = ui.value;
switch(ui.value) {
case 20:
s = '16W';
break;
case 22:
s = '18W';
break;
case 24:
s = '12W';
break;
}
$(".rsize").text(s);
}
});