[jquery-ui] Vertical slider as scroll bar not working correctly

[need to know more!]

Can anyone help. I have here a vertical slider being used to as a
scroll bar.  At the moment it works to some degree.
The slider handle is in the correct place at the top (value: 100) and
the div content starts at the top, but when I move the handle down the
div jumps to the bottom and scrolls up, when the handle is moved up,
the content moves down. I have tried playing with the values in vars
but this just causes some weird usability issues.

Someone please tell me where I have gone wrong or create a tutorial
for us newbies to jQuery how to build a slider as a scroll bar.

Also anyone want to tell me how to add buttons with disabled states
for when the top and bottom are reached.

Code rather than hints as I am new and need to see an example to help
it sink into my fragile mind.

Here is the code:
--------------------------------------------------------------------------------------------------------------------------
$(document).ready(function(){
  $("#content-slider").slider({
    animate: true,
        orientation: "vertical",
        value: 100,
    change: handleSliderChange,
    slide: handleSliderSlide
  });
});

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

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

--

You received this message because you are subscribed to the Google Groups 
"jQuery UI" group.
To post to this group, send email to jquery...@googlegroups.com.
To unsubscribe from this group, send email to 
jquery-ui+unsubscr...@googlegroups.com.
For more options, visit this group at 
http://groups.google.com/group/jquery-ui?hl=en.