function Scroller ( bgColor, frontColor, width, viewDiv, toScrollDiv, innerDiv, offset, heightAdd, viewHeigtDiff ) { 
	
	this.constructor = Scroller;
	
	if ( viewHeigtDiff == undefined ) viewHeigtDiff = 0;
	
	var bgCSS = "#scrollBG { width:|WIDTH|px; height:22px; position: absolute; z-index:999; }";
	var draggerCSS = "#scrollDragger { width:|WIDTH|px; height:22px; background-color:|COLOR|; position: absolute; z-index:1000; cursor: pointer; }";
	
	var mouseJump = 10;
	var percent = 0;
	var dragger;
	
	this.kill = function () {
		
		document.removeEvent('mousewheel', onScrollWheel );
		viewDiv.innerHTML = "";
		
	}
	
	function initScoll ( ) {
		
		if ( heightAdd == undefined ) {
			
			heightAdd = 0;
			
		}
		
		var viewHeight = toScrollDiv.offsetHeight;
		var innerHeight = innerDiv.offsetHeight-(-heightAdd);
		
		if ( viewHeight < innerDiv.offsetHeight ) {
		
			var tmpCss = bgCSS.split( "|WIDTH|" ).join ( width );
			var tmpCss = tmpCss.split( "|BGCOLOR|" ).join ( bgColor );
			addCss ( tmpCss );
			
			var tmpCss = draggerCSS.split( "|WIDTH|" ).join ( width );
			var tmpCss = tmpCss.split( "|COLOR|" ).join ( frontColor );
			addCss ( tmpCss );
			
			viewDiv.innerHTML = "<div id='scrollBG' ></div><div id='scrollDragger' ></div>";
			
			var sbg = $( "scrollBG" );
			var sdrag = $( "scrollDragger" );
			
			var targetX = findPosX ( toScrollDiv );
			var targetY = findPosY ( toScrollDiv );
			var selfX = findPosX ( sbg );
			var selfY = findPosY ( sbg );
			
			var diffX = targetX - selfX;
			var diffY = targetY - selfY;
			
			sbg.setStyle ( "marginTop", diffY+offset );
			sbg.setStyle ( "height", toScrollDiv.offsetHeight-offset-offset+viewHeigtDiff );
			sbg.setStyle ( "marginLeft", 0 );
			
			sdrag.setStyle ( "marginTop", diffY+offset+50 );
			sdrag.setStyle ( "height", 22 );
			sdrag.setStyle ( "marginLeft", diffX-width-offset-37 );
			sdrag.setStyle ( "opacity", 0.6 );
			
			sdrag.setStyle ( "top", 0 );
			sdrag.setStyle ( "left", 0 );
			
			dragger = new Drag ( sdrag, 0, 0, 0, toScrollDiv.offsetHeight-offset-offset-100+viewHeigtDiff );
			
			dragger.onUpdate = onDraggerUpdate;
			
			document.addEvent('mousewheel', onScrollWheel );
		
		}
		 
	}
	
	function onScrollWheel( event )
	{
		
		if ( checkMousePos(event) ) {
		
			if (event.wheel < 0)
			{ 
				
				wheelDown ( );
				
			}
			else
			{ 
				
				wheelUp ( );
				
			}
			
			Event.stop(event);
		
		}
		
	}

	function checkMousePos ( ereignis ) {
		
		var mouseX = dragger.getMouseX ();
		var mouseY = dragger.getMouseY ();
		
		var targetX = findPosX ( toScrollDiv );
		var targetY = findPosY ( toScrollDiv );
		
		var targetW = targetX+toScrollDiv.offsetWidth;
		var targetH = targetY+toScrollDiv.offsetHeight;
		
		if ( mouseX > targetX && mouseX < targetW && mouseY>targetY && mouseY<targetH ) {
			
			return true;
			
		} else {
			
			return false;
			
		}
		
	}
	
	function onDraggerUpdate ( perc ) {
		
		percent = perc;
		setContentToPercentage ( );
		
	}
	
	function setContentToPercentage ( ) {
		
		var min = 0;
		var viewHeight = toScrollDiv.offsetHeight;
		var innerHeight = innerDiv.offsetHeight-(-heightAdd);
		var max = -(innerHeight-viewHeight);
		var nPos = percent*(max/100);
		
		innerDiv.setStyle ( "margin-top", Math.round(nPos) );
		
	}

	function setDraggerToPercentage ( ) {
		
		dragger.setPercent ( percent );
		
	}
	
	function wheelUp ( ) {
		
		var min = 0;
		var viewHeight = toScrollDiv.offsetHeight;
		var innerHeight = innerDiv.offsetHeight-(-heightAdd);
		var max = -(innerHeight-viewHeight);
		
		var cContentPos = innerDiv.style.marginTop.split("px").join("")-1+1;
		
		cContentPos = cContentPos + mouseJump;
		if ( cContentPos > min ) cContentPos = min;
		else if ( cContentPos < max) cContentPos = max;
		
		percent = cContentPos/(max/100);
		setDraggerToPercentage ( );
		
		innerDiv.setStyle ( "margin-top", cContentPos );
		
	}
	
	function wheelDown ( ) {
		
		var min = 0;
		var viewHeight = toScrollDiv.offsetHeight;
		var innerHeight = innerDiv.offsetHeight-(-heightAdd);
		var max = -(innerHeight-viewHeight);
		
		var cContentPos = innerDiv.style.marginTop.split("px").join("")-1+1;
		
		cContentPos = cContentPos - mouseJump;
		if ( cContentPos > min ) cContentPos = min;
		else if ( cContentPos < max) cContentPos = max;
		
		percent = cContentPos/(max/100);
		setDraggerToPercentage ( );
		
		innerDiv.setStyle ( "margin-top", cContentPos );
		
	}
	
	function addCss ( cssCode ) {
		
		var styleElement = document.createElement("style");
		
		styleElement.type = "text/css";
		if (styleElement.styleSheet) {
			styleElement.styleSheet.cssText = cssCode;
		} else {
			styleElement.appendChild(document.createTextNode(cssCode));
		}
		
		document.getElementsByTagName("head")[0].appendChild(styleElement); 
		
	}
	
	function findPosX(obj)
	{
	  var curleft = 0;
	  if(obj.offsetParent)
	      while(1) 
	      {
	        curleft += obj.offsetLeft;
	        if(!obj.offsetParent)
	          break;
	        obj = obj.offsetParent;
	      }
	  else if(obj.x)
	      curleft += obj.x;
	  return curleft;
	}

	function findPosY(obj)
	{
	  var curtop = 0;
	  if(obj.offsetParent)
	      while(1)
	      {
	        curtop += obj.offsetTop;
	        if(!obj.offsetParent)
	          break;
	        obj = obj.offsetParent;
	      }
	  else if(obj.y)
	      curtop += obj.y;
	  return curtop;
	}
	
	initScoll ( );
	
};