function startScroller(){
	if(document.getElementById("scrollContainer") && document.getElementById("scrollContent")){
		var scroller;
		//collect the variables
		var docH = document.getElementById("scrollContent").offsetHeight;
		var contH = document.getElementById("scrollContainer").offsetHeight;
		var scrollAreaH = document.getElementById("scrollArea").offsetHeight;
		if(docH < scrollAreaH){
			document.getElementById("scrollArea").style.display = 'none';
		} else {
			//calculate height of scroller and resize the scroller div
			//(however, we make sure that it isn't to small for long pages)
			var scrollH = (contH * scrollAreaH) / docH;
			//if(scroller.scrollH < 15) scroller.scrollH = 15;
			document.getElementById("scroller").style.height = Math.round(scrollH) + "px";
			
			//what is the effective scroll distance once the scoller's height has been taken into account
			var scrollDist = Math.round(scrollAreaH-scrollH);
			
			//make the scroller div draggable
			Drag.init(document.getElementById("scroller"),null,0,0,-1,scrollDist);
			
			//add ondrag function
			document.getElementById("scroller").onDrag = function (x,y) {
			  var scrollY = parseInt(document.getElementById("scroller").style.top);
			  var docY = 0 - (scrollY * (docH - contH) / scrollDist);
			  document.getElementById("scrollContent").style.top = docY + "px";
			}
		}
	}
}
//
var overScrollArea = false;
function mayMouseScroll(method){
	if(method == 'yes'){
		overScrollArea = true;
	} else {
		overScrollArea = false;
	}
}
function handle(delta) {
	var scrl = document.getElementById("scrollContent").style.top.replace('px','')*1;
	//collect the variables
	var docH = document.getElementById("scrollContent").offsetHeight;
	var contH = document.getElementById("scrollContainer").offsetHeight;
	var scrollAreaH = document.getElementById("scrollArea").offsetHeight;
	var scrollH = (contH * scrollAreaH) / docH;
	var scrollDist = Math.round(scrollAreaH-scrollH);
	var scrollerH = document.getElementById("scroller").style.height.replace('px','')*1;
	var scrollerT = document.getElementById("scroller").style.top.replace('px','')*1;
	if(docH > scrollAreaH && scrollAreaH > 0){			
		if(delta < 0){
			if(scrl >= scrollAreaH-docH+20){
				document.getElementById("scrollContent").style.top = (scrl-20) + "px";
				var sbPlus = 0-(scrl-20);
				if(sbPlus > scrollAreaH-scrollerH){
					var sbPlus = scrollAreaH-scrollerH;
				}
			} else {
				document.getElementById("scrollContent").style.top = (scrollAreaH-docH) + "px";
				var sbPlus = scrollAreaH-scrollerH;
			}
		} else {
			
			if(scrl < 0){
				document.getElementById("scrollContent").style.top = (scrl+20) + "px";
				//var sbPlus = (0-((scrollAreaH-scrollerH)*((scrl+20)/100)));
				var sbPlus = 0-(scrl+20);
			} else {
				document.getElementById("scrollContent").style.top = (0) + "px";
				var sbPlus = 0;
			}
			if(sbPlus > scrollAreaH-scrollerH){
				var sbPlus = scrollAreaH-scrollerH;
			}
		}
		//scrollbar
		var scrT = document.getElementById("scrollContent").style.top.replace('px','');
		var sbY = (scrT.replace('-','') * scrollDist) / (docH - contH);
		//document.title = document.getElementById("scrollContent").style.top+' - '+sbY;
		document.getElementById("scroller").style.top = sbY + "px";
		//
	}
}
function wheel(event){
	//ie
	if(!event){
		event = window.event;
	}
	if(!overScrollArea){
		event.returnValue = true;
	} else {
		var delta = 0;
		//ie/opera
		if(event.wheelDelta){
			delta = event.wheelDelta/120;
			//opera 9
			if(window.opera){
				delta = -delta;
			}
		//mozilla
		} else if(event.detail){ 
			delta = -event.detail/3;
		}
		if(delta){
			event.returnValue = false;
			handle(delta);
		}
		//prevent default actions caused by mouse wheel
		if(event.preventDefault){
			event.preventDefault();
		}
		event.returnValue = false;
	}
}
//initialization code
if(window.addEventListener){
	//DOMMouseScroll is for mozilla
	window.addEventListener('DOMMouseScroll', wheel, false);
}
//ie/opera
window.onmousewheel = document.onmousewheel = wheel;