// API: content_element, slider[, slider_options]

function js_scrollbar(content, slider, options)
{
	// Standard-Optionen
	var slider_options = {
		orientation: "vertical"
	};
	// Scrollbaren Bereich in zwei <div> verpacken
	var $box = $(content);
	if (!$box.length) return;
	var $inner_scrollbox = $('<div>');
	var $scrollbox = $('<div class="scrollbox">');
	$inner_scrollbox.css({
		position: 'absolute',
		top: '0px',
		left: '0px',
		width: '100%'
	});
	$inner_scrollbox.append($box.children().clone(true));
	$scrollbox.append($inner_scrollbox);
	$box.empty().append($scrollbox);
	$scrollbox.css({
		position: 'relative',
		overflow: 'hidden',
		height: $box.height() + 'px'
	});
	// Browser-Scrollleiste ausblenden
	$box.css({
		overflow: 'hidden'
	});
	// Slider-Parameter
	var $scrollbar = $(slider);
	var scroll_max = $inner_scrollbox.height() - $scrollbox.height();
	// Zu Wert Scrollen
	function scroll_to(value) {
		$inner_scrollbox.css({
			top: '-' + (scroll_max - value) + 'px'
		});
	}
	// Slider-Handler
	function handle_slide(event, ui) {
		scroll_to(ui.value);
	}
	// Slider starten
	slider_options = $.extend(slider_options, options, {
		min: 0,
		max: scroll_max,
		value: scroll_max,
		slide: handle_slide,
		change: handle_slide
	});
	$scrollbar.slider(slider_options);
	// Handler für MouseWheel-Event
	function handle_mousewheel(event, delta) {
		var scroll_delta = delta * 20;
		var value = $scrollbar.slider('value');
		value += scroll_delta;
		if (value > scroll_max) value = scroll_max;
		else if (value < 0) value = 0;
		$scrollbar.slider('value', value);
	}
	// MouseWheel-Handler registieren
	 // Falls einziger scrollbarer Bereich evtl.:
	 // $('body').bind('mousewheel', handle_mousewheel);
	$box.bind('mousewheel', handle_mousewheel);
	$scrollbar.bind('mousewheel', handle_mousewheel);
	// Handler für Fenster-Resize (optional)
	/*
	function handle_resize() {
		$scrollbox.css({
			height: $box.height() + 'px'
		});
		scroll_max = $inner_scrollbox.height() - $scrollbox.height();
		$scrollbar.slider('option', 'max', scroll_max);
		$scrollbar.slider('value', $scrollbar.slider('value'));
		if ($box.height() > $inner_scrollbox.height())
			$scrollbar.hide();
		else
			$scrollbar.show();
	}
	$(window).bind('resize', handle_resize);
	handle_resize();
	*/
}

// Beispiel
$(document).ready(function () {
	js_scrollbar('#content', '#scrollbar');
});