JSFiddle - React, Tailwind, and code Playground

by marketingaddict8

HTML

<div id="text">the text in <span></span>px: this is the size</div>
<div id="slider"></div>

CSS

#text {
    margin: 20px 0;
}
#slider {
    width:300px;
}

JavaScript

$('#slider').slider({
    min: 8,
    max: 50,
    slide: function (event, ui) {
        console.log(ui);
        $('#text span').html(ui.value);
        $('#text').css('font-size',ui.value+'px')
    }
});