JQuery UI Slider

Sample code for a JQuery UI slider

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css">
<h1>HTML Slider Test</h1>

<div id="slider"></div>
<p>Memory protection will trigger when the heap usage gets above <span id="slider-value"></span>%</p>

CSS

h1 {
    font-family: Helvetica, Arial;
    font-weight: bold;
    font-size: 18px;
}
body, p {
    font-family: Helvetica, Arial;
}
#slider {
    margin-right: 5px;
    background: #C20500;
}
#slider .ui-slider-range {
    background: #008B28;
}
#slider .ui-slider-handle {
    border-color: #729fcf;
}

JavaScript

$("#slider").slider({
    value: 90,
    min: 0,
    max: 100,
    step: 1,
    range: "min",
    slide: function (event, ui) {
        $("#slider-value").html(ui.value);
    }
});

$("#slider-value").html($('#slider').slider('value'));