jQuery: Slider customize the style jQueryui.com slider

Just add the following css class in your default style sheet:

//class for slider

.ui-slider

{

    position: relative;

    text-align: left;

    height: 6px;

}

//class for slider selected range

.ui-slider .ui-slider-range

{

    height: 6px;

    position: absolute;

    z-index: 1;

    font-size: .5em;

    display: block;

    border: 0;

    background-position: 0 0;

    background: #FFBF80;

}

//class for little hand that moves through the slide

.ui-slider .ui-slider-handle

{

    position: absolute;

    z-index: 2;

    height: 12px;

    cursor: default;

}