$(function() {
$("#slider").slider(
    { change: handleChange,
orientation: "vertical",

        slide: handleSlide,
        min: -100,
    max: 0 });
});

function handleChange(e, ui) {
    var maxScroll = $("#scroller")
      .attr("scrollHeight") -
      $("#scroller").height();
    $("#scroller")
      .animate({ scrollTop: -ui.value *
     (maxScroll / 100)
    }, 1000);

}

function handleSlide(e, ui) {
    var maxScroll = $("#scroller")
      .attr("scrollHeight") -
      $("#scroller").height();
    $("#scroller")
      .attr({ scrollTop: -ui.value
        * (maxScroll / 100)   });

}