var sHTML= '<DIV ID="scrDivs">' +
	'<IMG SRC="jscripts/scrup.gif" ID="scrUp" WIDTH="16" HEIGHT="15" onmousedown="bMouseIsUp=false;scrollUp()">' + 
	'<IMG SRC="jscripts/scrdn.gif" ID="scrDn" WIDTH="16" HEIGHT="15" onmousedown="bMouseIsUp=false;scrollDown()">' +
	'<DIV ID="scrollBar" onmousedown="grab(event)"></DIV>' + 
    '<DIV ID="scrollBack" onclick="largeScroll(event)"></DIV></DIV>';
document.writeln(sHTML);

function g(id) {
	var e = document.getElementById(id);
	e.setLeft = function(c) {
		if(this.style.pixelLeft) this.style.pixelLeft = c;
		else this.style.left = c + 'px';
		return this;
	}
	e.setTop = function(c) {
		if(this.style.pixelTop) this.style.pixelTop = c;
		else this.style.top = c + 'px';
		return this;
	}
	e.getTop = function() {		
		if(this.style.pixelTop) return this.style.pixelTop;
		else return parseInt(this.style.top, 10);
	}
	e.setHeight = function(c) {
		if(this.style.pixelHeight) this.style.pixelHeight = c;
		else this.style.height = c + 'px';;
		return this;
	}
	e.setWidth = function(c) {
		if(this.style.pixelWidth) this.style.pixelWidth = c;
		else this.style.width = c;		
		return this;
	}

	return e;
}

var scrUp = g('scrUp');
var sDiv = g('sDiv');
var scrollBack = g('scrollBack');
var scrollBar = g('scrollBar');
var scrDn = g('scrDn');
var scrDivs = g('scrDivs');

var iArwHeight=scrUp.offsetHeight;
var iArwWidth=scrUp.offsetWidth;
var iScrHeight=sDiv.offsetHeight;

var iSBarDist;
var iSDivDist;
var fSBarRatio;
var fScrRatio;

var iCurY=0; 
var iNewY;
var iDistY;
var iHighY=null
var iLowY=null
var oSBar=null;
var bMouseIsUp=true;

var x=0;
var y=0;
var e=sDiv;

while (e.tagName!="BODY") {	
	if(e.clientLeft) {
		x=x+e.offsetLeft-e.clientLeft;
		y=y+e.offsetTop-e.clientTop;
	} else {
		x+=e.offsetLeft;
		y+=e.offsetTop;		
	}
    e=e.offsetParent;
    }
  
var iPosX=x+sDiv.offsetWidth-1; 
var iPosY=y+1;

scrUp.setTop(iPosY).setLeft(iPosX);
scrDn.setTop(iPosY+iScrHeight-iArwHeight).setLeft(iPosX);
scrollBack.setLeft(iPosX).setTop(iPosY+iArwHeight);
scrollBack.setHeight(iScrHeight-(iArwHeight*2)).setWidth(iArwWidth);

scrollBar.style.backgroundColor=sBarColor;
scrUp.style.backgroundColor=arwColor;
scrDn.style.backgroundColor=arwColor;
sDiv.style.borderColor=sDivBorder;
scrollBar.style.borderColor=sBarColdBorder;
scrollBack.style.backgroundColor=sBack;
scrollBack.style.borderColor=sBackBorder;

var ss=scrollBar.style;

function refreshScr(){
    fSBarRatio=(sDiv.offsetHeight/sDiv.scrollHeight);
    if (fSBarRatio>=1) scrDivs.style.display="none";
    else {
        scrDivs.style.display="";
        iScrHeight=sDiv.offsetHeight;
        scrollBar.setLeft(iPosX).setTop(iPosY+iArwHeight);
        scrollBar.setHeight(scrollBack.offsetHeight*fSBarRatio).setWidth(iArwWidth);
        iSBarDist=scrollBack.offsetHeight-scrollBar.offsetHeight;
        iSDivDist=sDiv.scrollHeight-sDiv.offsetHeight;
        fScrRatio=iSBarDist/iSDivDist;
        }
    }

function largeScroll(event){
    if (event.clientY>scrollBar.getTop())
        sDiv.scrollTop+=(iScrHeight-14);
    else sDiv.scrollTop+=0-(iScrHeight-14); 
    }

function scrollDown(){
    if (bMouseIsUp) return;
    sDiv.scrollTop+=10;
    setTimeout("scrollDown()",50);
    }

function scrollUp(){
    if (bMouseIsUp) return;
    sDiv.scrollTop+=-10;
    setTimeout("scrollUp()",50);
    }

function grab(ev){ 
	if(event === undefined) var event = ev;
	oSBar = event.srcElement || event.target;
	iCurY=event.clientY; 
    oSBar.style.borderColor=sBarHotBorder; 
    bMouseIsUp=false;
    }

function move(ev){
	if(document.all) var ev = event;		
	
    if (!oSBar) return; 
    if (((!iHighY) 
		|| (iHighY <=ev.clientY))
        &&((!iLowY) 
		|| (iLowY >=ev.clientY))){		
        iHighY=null;
        iLowY=null;
        oSBar.style.borderColor=sBarHotBorder;
		iNewY=ev.clientY;		
        iDistY=iNewY-iCurY;
        iCurY=iNewY;
        if ((oSBar.offsetTop+iDistY)<iPosY+iArwHeight){		
            oSBar.setTop(iPosY+iArwHeight); 
            sDiv.scrollTop=0;
            iHighY=iNewY;
            }
        else if ((oSBar.getTop()+oSBar.offsetHeight+iDistY)>scrDn.offsetTop){ 			
            oSBar.setTop(scrDn.offsetTop-oSBar.offsetHeight); 
            sDiv.scrollTop=((scrollBar.style.pixelTop-(iArwHeight+iPosY))/fScrRatio);
            iLowY=iNewY;
            }
        else {			
            oSBar.setTop(oSBar.getTop()+iDistY);
            sDiv.scrollTop=((oSBar.offsetTop-(iArwHeight+iPosY))/fScrRatio);
            }
        }
	}

function drop(ev){
    scrollBar.style.borderColor=sBarColdBorder;
    oSBar=null;
    iHighY=null;
    iLowY=null;
    bMouseIsUp=true;
    }

function killEvent(){ 
    return false;
    }

function synch(){
    if (!oSBar) scrollBar.setTop((sDiv.scrollTop*fScrRatio)+iArwHeight+iPosY);
    }

document.onmousemove=move;
document.onmouseup=drop;
sDiv.onscroll=synch;
scrollBar.onselectstart=killEvent;
refreshScr();