window.addEvent('domready', function() {
	$('scrollbar').setOpacity(0);
	//new Element('div').setHTML("<div id=\"scrollbar\"><div id=\"knob\"></div></div>").injectInside($('txt_title'));	
		
	//Vertical Scrollbar =============================================================
	var textH = $('rightbox').getStyle('height').toInt();
	var textC = $('text').getStyle('height').toInt();
	var stepz = textC-textH;

	if (textC < textH) {
	$('scrollbar').setStyle('visibility','hidden');
	}
	
	if (textC > textH) {
	$('scrollbar').setOpacity(1);
	$('scrollbar').setStyle('visibility','visible');
	// $('knob').setStyle('height',); // I want to dynamically set the height of KNOB to indicate text length.
	}

	//alert(stepz);

	var scrollbar = new Slider($('scrollbar'), $('knob'), {	
	steps: stepz,	
	mode: 'vertical',	
	onChange: function(step){
		$('stepz').setHTML(step); //prints steps to element		
		$('text').setStyle('top', '-'+step+'px');
		if (step == 0) {
			$('knob').addClass('a');
			$('knob').removeClass('b');
			$('knob').removeClass('c');			
		} else if (step == stepz) {
			$('knob').addClass('c');
			$('knob').removeClass('a');
			$('knob').removeClass('b');
		} else {
			$('knob').addClass('b');
			$('knob').removeClass('a');
			$('knob').removeClass('c');			
		}
	}
	}).set(0);
	


});