function Scroller(container,content,id,offset){

   this.id = id;
   this.delta = 0;
   this.container=container;
   this.content=content;
   this.d = null;
   this.dScrollBullet = null;
   this.dScrollBar = null;
   
   this.dScrollMasque = document.createElement("DIV");
   //this.dScrollMasque = null;
   this.loadedobjects="";
   this.startClick = 0;
   this.widthScroller = 10;
   this.offsetScroll = offset;
   this.parentOffset = this.container.offsetTop + this.container.parentNode.offsetTop;
   this.ini();
   
  
   this.updateScroller();

 
  
}
Scroller.prototype.hide=function(){
this.d.style.visibility = "hidden";
}

Scroller.prototype.show=function(){
this.d.style.visibility = "visible";
}
Scroller.prototype.updateScroller=function(){

 this.content.style.height = (this.container.clientHeight-30) + "px";
 this.content.style.width =  (this.container.clientWidth-30) + "px";

 this.dScrollMasque.style.width = (2*document.body.clientWidth) + "px";
 this.dScrollMasque.style.height = (2*document.body.clientHeight) + "px";
 
 /*this.content.style.border = "solid 1px black";
 alert((this.container.clientHeight-5) + "px");*/
 this.parentOffset = this.container.offsetTop;
 p = this.container.parentNode;
 while(p!=null)
 {
	this.parentOffset  =  this.parentOffset  + p.offsetTop;
	p = p.parentNode;
	if(p!=null)
	{
		if(p.tagName.toUpperCase() != "DIV")
		{
			break;
		}
	}
 }
 
  
 this.content.width = this.container.clientHeight-this.widthScroller;
 this.content.style.overflow = "hidden";
 this.d.height = this.content.height;
 
 this.scale = (this.content.scrollHeight/this.content.clientHeight);
 this.scrollTop = this.content.scrollTop;
 
 if(this.content.clientHeight>0)
 {
 
	 document.getElementById(this.id+"cImgScroll").style.height = (this.content.clientHeight-10) + "px";
	 document.getElementById(this.id+"cImgScroll").style.width = 10 + "px";
	 document.getElementById(this.id+"dArrowBody").style.height = (this.content.clientHeight-10) + "px";
 }
 
 if(this.content.clientHeight>=this.content.scrollHeight)
 {
	this.d.style.visibility = "hidden";
	this.content.scrollTop = 0;
 }
 else
 {
 
	this.d.style.visibility = "visible";
 }
 
 this.dScrollMasque.style.display = "none";
  
 }




Scroller.prototype.ini=function() {

this.loadobjs("./js/scroller/scroller.css");
this.content.width = this.container.width - this.widthScroller;
this.content.style.overflow = "hidden";
this.d = document.createElement("DIV");
this.d.className="scrollBarContener";
var t = document.createElement("TABLE");
t.className="tableScrollbar";
t.cellSpacing = 0;
t.cellPadding = 0;
var b = document.createElement("TBODY");
t.appendChild(b);
var r = document.createElement("TR");
var c1 = document.createElement("TD");
var c2 = document.createElement("TD");

r.appendChild(c1);
r.appendChild(c2);
c1.appendChild(this.content);
c2.appendChild(this.d);
b.appendChild(r);

//this.container.removeChild(this.content);
this.container.style.unselectable = "on";
this.container.appendChild(t);
this.content.scrollTop = 0;




var dScrollBar = document.createElement("DIV");


dScrollBullet = document.createElement("DIV");

dScrollBar.className="scrollBarContener";
if(this.content.style.marginTop!="")
{
	dScrollBar.style.marginTop = parseFloat(this.content.style.marginTop)+"px";
	
}
else
{
dScrollBar.style.marginTop = this.offsetScroll -10;
}

if(this.content.style.paddingTop!="")
{
	dScrollBar.style.marginTop = parseFloat(this.content.style.paddingTop)+"px";
}

var strHTMLScrollBar = "<table class=\"tableScrollbar\" border=\"0\" padding=\"0\" cellpadding=\"0px\" cellspacing=\"0px\"><tbody>";
strHTMLScrollBar = strHTMLScrollBar + "<tr><td ><div id=\""+this.id+"dArrowTop\" class=\"arrowTop\"><img src=\"./js/scroller/arrowTop.png\"></div></td></tr>";
strHTMLScrollBar = strHTMLScrollBar + "<tr><td ><div style=\"height:300px\" id=\""+this.id+"dArrowBody\" class=\"arrowBody\"><img height=\"300px\" width=\"7px\" id=\""+this.id+"cImgScroll\" src=\"unpix.gif\"></div></td></tr>";
strHTMLScrollBar = strHTMLScrollBar + "<tr><td ><div  id=\""+this.id+"dArrowBottom\" class=\"arrowBody\"><img src=\"./js/scroller/arrowBottom.png\"></div></td></tr>";
strHTMLScrollBar = strHTMLScrollBar + "</tbody></table>";

dScrollBar.innerHTML = strHTMLScrollBar;

this.d.appendChild(dScrollBar);



dScrollBullet.className = "scrollBullet";

this.d.appendChild(dScrollBullet);
if(dScrollBar.style.marginTop!="")
{
this.offsetScroll  = this.offsetScroll + parseFloat(dScrollBar.style.marginTop.replace("px",""));
}
if(dScrollBar.style.paddingTop!="")
{
this.offsetScroll  = this.offsetScroll + parseFloat(dScrollBar.style.paddingTop.replace("px",""));
}


if(this.container.style.marginTop!="")
{

	this.offsetScroll  = this.offsetScroll + parseFloat(this.container.style.marginTop.replace("px",""));
	this.delta = parseFloat(this.container.style.marginTop.replace("px",""));
	

}
dScrollBullet.style.top = this.offsetScroll + "px";


dScrollBullet.startClick = 0;
dScrollBullet.scroller = this;
dScrollBullet.isMoving = false;




this.dScrollMasque.style.position ="absolute";
this.dScrollMasque.style.top = 0;
this.dScrollMasque.style.left = 0;
this.dScrollMasque.style.width = document.body.clientWidth + "px";
this.dScrollMasque.style.height = document.body.clientHeight + "px";
this.dScrollMasque.style.display = "none";
this.dScrollMasque.style.zIndex = 5100;
this.dScrollMasque.style.backgroundImage = "url('unpix.gif')";
this.dScrollMasque.scroller = this;


var body= document.getElementsByTagName('BODY')[0];


this.dScrollMasque.onmousemove = function(e)
{
	this.scroller.dScrollBar.onmousemove(e);
}

this.dScrollMasque.onmouseup = function(e)
{
	this.scroller.dScrollBar.onmouseup(e);
}

this.dScrollMasque.onmouseout = function(e)
{
	this.scroller.dScrollBar.onmouseup(e);
}

body.appendChild(this.dScrollMasque);
dScrollBullet.dScrollMasque = this.dScrollMasque;
dScrollBullet.onmousedown = function(e)
{
	this.dScrollMasque.style.display = 'block';
	this.isMoving = true;
}

var arrowBody = document.getElementById(this.id+"dArrowBody");

dScrollBar = arrowBody;
this.dScrollBar = dScrollBar;
dScrollBar.dScrollBullet = dScrollBullet;
dScrollBar.scroller = this;

dScrollBar.onmouseout = function(e)
{
	this.dScrollBullet.isMoving = false;
}

dScrollBar.onmousedown = function(e)
{
	this.dScrollBullet.isMoving = true;
}

dScrollBar.onmouseup = function(e)
{
		this.onmousemove(e);
		this.dScrollBullet.isMoving = false;
		this.scroller.dScrollMasque.style.display = 'none';
}


dScrollBar.onmousemove = function(e)
{
	if(this.dScrollBullet.isMoving)
	{
	
		var ytoscroll = ( getMousePosition(e).y - this.scroller.parentOffset);
		this.scrollTo(ytoscroll);
	
	}
		
}


dScrollBar.scrollTo  = function(ytoscroll)
{
		var min = this.scroller.offsetScroll;
		
	//	this.delta = -5;
		
		
		var max = parseFloat(this.scroller.content.style.height)+this.scroller.delta-5;
		
		//alert(max);
		var a = (this.scroller.content.scrollHeight-parseFloat(this.scroller.content.style.height))/(max-min);
		var b = -a*min;
	
		//console.log(min);
		if(ytoscroll<min)
		{
			ytoscroll = min;
		}
		if(ytoscroll>max)
		{
			ytoscroll = max;
		}
		
		
		this.dScrollBullet.style.top =  ytoscroll + "px";
		
		this.scroller.content.scrollTop  = (ytoscroll*a+b);
}

dScrollBar.scrollUp = function()
{
	this.scrollTo(parseFloat(this.dScrollBullet.style.top) - 40);
	
	
}

dScrollBar.scrollDown = function()
{
	this.scrollTo(parseFloat(this.dScrollBullet.style.top) + 40);
}

this.content.onsize = this.updateScroller;

dScrollBullet.onmouseup = function(e)
{
	this.scroller.dScrollBar.onmousemove(e);
	this.isMoving = false;
	
}

var arrow = document.getElementById(this.id+"dArrowTop");
 arrow.dScrollBar = this.dScrollBar;
 arrow.onmouseup = function()
 {
	this.dScrollBar.scrollUp();
 }
 arrow = document.getElementById(this.id+"dArrowBottom");
 arrow.dScrollBar = this.dScrollBar;
 arrow.onmouseup = function()
 {
	this.dScrollBar.scrollDown();
 }
 
}

Scroller.prototype.loadobjs=function(){
if (!document.getElementById)
return
for (i=0; i<arguments.length; i++){
var file=arguments[i]
var fileref=""
if (this.loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
if (file.indexOf(".js")!=-1){ //If object is a js file
fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", file);
}
else if (file.indexOf(".css")!=-1){ //If object is a css file
fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", file);
}
}
if (fileref!=""){
document.getElementsByTagName("head").item(0).appendChild(fileref)
this.loadedobjects+=file+" " //Remember this object as being already added to page
}
}
}