JSFiddle - React, Tailwind, and code Playground

by trolleymusic

HTML

<script src="wd.local:4000/assets/js/plugins.js"></script>
<div id="samples-01">
    <div class="range">
        <input type="range" min="0" max="99" value="50">
    </div>
    <div class="range">
        <input type="range" class="inside" min="0" max="99" value="50">
    </div>
</div>

CSS

#samples-01 {
    position: relative;
    margin: 50px;
    -webkit-transform: translate(0, 100px) rotate(90deg);
}

.range {
    width: 100%;
    height: 81px;    
}

input[type="range"] {
    width: 100%;
    height: 20px;
}

JavaScript

$(function() {
    $('#samples-01 input[type="range"]').range();
});