var mouseInit = slideInit = 0;
var slider, xscroll, nContent,box;
var xH,xT,nSH,nOH;

function init(){
    box = document.getElementById("box");
    slider = document.getElementById("slider");
 xscroll = document.getElementById("xscroll");
 nContent = document.getElementById("nContent");
 
 slider.style.left = xscroll.offsetLeft - xscroll.offsetWidth/2-1;
 slider.style.top = xscroll.offsetTop;
 slider.style.visibility = "visible";
 
 xH = xscroll.offsetTop + xscroll.offsetHeight - slider.offsetHeight;
 xT = xscroll.offsetTop;
 nSH = nContent.scrollHeight;
 nOH = nContent.offsetHeight;
    if(nSH <= nContent.clientHeight){
  xscroll.style.visibility = "hidden";
  slider.style.visibility = "hidden";
 }
}

function xs_scroll(){
    // Call Init function
 init();

 slider.onmousedown =function(){
   slider.setCapture();
   mouseInit = event.clientY;
   slideInit = parseInt(slider.style.marginTop);
   slider.onmousemove= setPos;
 }

 slider.onmouseup = document.onmouseup = function(){
   slider.onmousemove = "";
   slider.releaseCapture();
 }
 
 box.ondragstart = box.onselectstart = function(){
   event.returnValue =false;
   return false;
 }
}
    //Set slider Position
function setPos(){
 var m = slideInit + (event.clientY - mouseInit);
 if (m < 0) m = 0;
 if (m > xscroll.clientHeight-slider.offsetHeight) m = xscroll.offsetHeight-slider.offsetHeight;

 slider.style.marginTop = m + "px";
 nContent.scrollTop = (nSH-nOH)*parseInt(m)/(xscroll.clientHeight-slider.clientHeight);
}

    //Reset Box Layout
function window.onresize (){
    box.style.left = "0px";
 box.style.right = "0px";
}