JSFiddle - React, Tailwind, and code Playground

by JonNorman

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<script src="https://github.com/carhartl/jquery-cookie/blob/master/jquery.cookie.js"></script>
<div id="value"></div>
<div id="slider"></div>

CSS

#value{position:absolute;left:10%}
#slider{position:absolute;width:80%;left:10%;top:20px}

JavaScript

$(function() {
    $("#slider").slider({
        value:isNaN(parseInt($.cookie("sliderpos")))?0:parseInt($.cookie("sliderpos")),
            min: 0,
            max: 500,
            step: 1,
            slide: function( event, ui ) {
                $( "#value" ).html( ui.value );
                $.cookie("sliderpos",ui.value)
            }
        });
});