function makeScrollbar(content,scrollbar,handle,horizontal,ignoreMouse){
	var steps = (horizontal?(content.getScrollSize().x - content.getSize().x):(content.getScrollSize().y - content.getSize().y))
	var slider = new Slider(scrollbar, handle, {	
		steps: steps,
		mode: (horizontal?'horizontal':'vertical'),
		onChange: function(step){
			// Scrolls the content element in x or y direction.
			var x = (horizontal?step:0);
			var y = (horizontal?0:step);
			content.scrollTo(x,y);
		}
	}).set(0);
	if( !(ignoreMouse) ){
		// Scroll the content element when the mousewheel is used within the 
		// content or the scrollbar element.
		$$(content, scrollbar).addEvent('mousewheel', function(e){	
			e = new Event(e).stop();
			var step = slider.step - e.wheel * 30;	
			slider.set(step);
		});
	}
	// Stops the handle dragging process when the mouse leaves the document body.
	$(document.body).addEvent('mouseleave',function(){slider.drag.stop()});
}

function fullheight(){
	/* first: resize the div with id "sidebar" ('#sidebar') to fit all the room below the top menu bar: */
	//var newWindowHeight = $('body').getSize();
	var newWindowHeight = window.getSize().y;
	newWindowHeight = newWindowHeight -90;
	//newWindowHeight-=90;    /* change the calculation accordingly!!! (in my case, the top menu was 60 Pixels high -> rest is full height-60 px) */
	$("leftcontent").setStyle("height", newWindowHeight );   /* set the CSS-property "height" of element (div) with id "sidebar" to the calculated value stored in variable "newWindowHeight"  */
	$("leftcontentbox").setStyle("height", newWindowHeight );
	$("scrollbar1").setStyle("height", newWindowHeight-40 );
	$("content").setStyle("height", newWindowHeight );
	$("contentbox").setStyle("height", newWindowHeight );
	$("scrollbar2").setStyle("height", newWindowHeight-40 );
	$("rightcontent").setStyle("height", newWindowHeight );
	$("rightcontentbox").setStyle("height", newWindowHeight );
	$("scrollbar3").setStyle("height", newWindowHeight-40 );
};

window.addEvent('domready', function(){
// -- first example, vertical scrollbar --
fullheight();
makeScrollbar( $('leftcontentbox'), $('scrollbar1'), $('handle1') );
makeScrollbar( $('contentbox'), $('scrollbar2'), $('handle2') );
makeScrollbar( $('rightcontentbox'), $('scrollbar3'), $('handle3') );
});
window.addEvent('resize', function(){
fullheight();
});