When you are holding the handles to slide them the width of the range blows out to 100% width, but snaps back to the width it's supposed to be once you release the handle.

jQuery 1.4.2
UI 1.8.2

please help

jQuery

if ($("#topImageSlider").length){
    var max = 120;
    var initialValue = 40;

    function refreshValue(){
        //$('#sliderValue .current').text($("#topImageSlider").slider("value"));
        $('#sliderValue .current').text($('.ui-slider-range').width());
    }

    $("#topImageSlider").slider({
        orientation: 'horizontal',
        range: "min",
        max: max,
        min: 1,
        value: initialValue,
        slide: refreshValue,
        change: refreshValue
    }).after('<div id="sliderValue"><span class="current">'+ initialValue +'</span> / <span class="max">'+ max +'</span></div>');
}

css

#topImageSlider,
#sliderValue {
    margin: 0 auto;
    width: 572px;
    text-align: center;
}
#topImageSlider {
    margin-top: 20px;
    background: url(../img/bg/slider.png) no-repeat;
    height: 5px;
}
#topImageSlider .ui-slider-range {
    background: url(../img/bg/slider-progress.gif) repeat-x;
    left: 2px;
    height: 5px;
}
#topImageSlider .ui-slider-handle {
    background: url(../img/btn/slider-handle.png) no-repeat;
    width: 24px;
    height: 24px;
    top: -8px;
    outline: 0;
    cursor: pointer;
    z-index: 999;
}
#sliderValue {
    margin-top: 10px;
    color: #bbb;
    font-weight: bold;
}
#sliderValue .current {
    color: #ff6e0d;
}