divScroll=function(
    objId
){
    /*this.error=document.createElement('DIV');
    this.error.style.position="absolute";
    this.error.style.top='200px';
    this.error.style.left='150px';
    this.error.style.border='1px solid white';
    document.body.appendChild(this.error);*/
    var self=this;
    //creo el timeout para subir y bajar
    this.timeoutUp=new Object;
    this.timeoutDown=new Object;
    //variable que indica si se está arrastrando o no
    this.dragging=false;
    //variable que idica si estamos encima del contenido
    this.onContent=false;
    //clonamos el div con el contenido
    //para calcular el ancho y alto real, debemos darle a la capa origen el overflow hidden para que se acople
    document.getElementById(objId).style.overflow='hidden';
    var ancho=document.getElementById(objId).offsetWidth;
    var alto=document.getElementById(objId).offsetHeight;
    this.dvContent=document.getElementById(objId).cloneNode(true);
    //estilos de la mascara
    this.dvMask=document.createElement('DIV');
    this.dvMask.style.position='relative';
    this.dvMask.style.zIndex='1';
    this.dvMask.style.height=alto+'px';    
    this.dvMask.style.width=ancho+'px';
    this.dvMask.style.overflow='hidden';
    //this.dvMask.id='submain';
    this.dvMask.className='scrollMask';
    //añadimos la máscara al documento, y eliminamos el div con el contenido, ya que lo tenemos clonado en this.dvContent
    document.getElementById(objId).parentNode.insertBefore(this.dvMask, document.getElementById(objId))
    document.getElementById(objId).parentNode.removeChild(document.getElementById(objId));
    //estilos del contenido
    this.dvContent.className='scrollContent';
    this.dvContent.id="";
    this.dvContent.style.position='absolute';
    this.dvContent.style.top='0px';
    this.dvContent.style.left='0';
    //al ponerse encima del conenido activo una variable, que servira para hacer scroll al girar la rueda
    this.dvContent.onmouseover=function(){
        self.onContent=true;
    }
    this.dvContent.onmouseout=function(){
        self.onContent=false;
    }
    this.dvMask.appendChild(this.dvContent);
    //estilos de la barra
    this.dvScroll=document.createElement('DIV');
    this.dvScroll.style.position='absolute';
    this.dvScroll.style.height=alto+'px';
    this.dvScroll.style.right='0';
    this.dvScroll.style.top='0';
    this.dvScroll.className='scrollBar';
    this.dvScroll.onmousedown=function(){
        //ponemos esto para que no se ralle al pinchar en el drag
        return false;
    }
    this.dvScroll.onclick=function(e){
        //al hacer click sobre la barra hacemos que se desplace la mitad de la distancia entre el click y la posicion del scroll hacia arriba o abajo
        if (document.all){
            var obj=event.srcElement;
            layerY=event.offsetY;
        }
        else{
            var obj=e.target;
            layerY=e.layerY
        }
        if (obj==this){
            if (self.dvDragPosY>layerY){
                if (self.dvDragPosY>layerY){
                    self.dvDragPosY=self.dvDragPosY-parseInt(((self.dvDragPosY-layerY)/2));
                }
                if (self.dvDragPosY<self.dvUp.offsetHeight){
                    self.dvDragPosY=self.dvUp.offsetHeight;
                }
            }else{
                if (self.dvDragPosY+self.dvDrag.offsetHeight<layerY){
                    self.dvDragPosY=self.dvDragPosY+parseInt(((layerY-self.dvDragPosY-self.dvDrag.offsetHeight)/2));
                }
                if (self.dvDragPosY+self.dvDrag.offsetHeight>self.dvScroll.offsetHeight-self.dvDown.offsetHeight){
                    self.dvDragPosY=self.dvScroll.offsetHeight-self.dvDown.offsetHeight-self.dvDrag.offsetHeight;
                }
            }
            self.mueveContenido();
        }
    }
    //flecha_arriba
    this.dvUp=document.createElement('DIV');
    this.dvUp.style.position='absolute';
    this.dvUp.style.top='0';
    this.dvUp.style.right='0';
    this.dvUp.className='scrollBar_Up';
    this.dvUp.onmousedown=function(){
        self.timeoutUp=setTimeout(self.goUp, 5);
    };
    this.dvUp.onmouseup=function(){
        self.timeoutUp=clearTimeout(self.timeoutUp);
    };
    this.dvUp.onmouseout=function(){
        self.timeoutUp=clearTimeout(self.timeoutUp);
    }
    this.dvScroll.appendChild(this.dvUp);
    //flecha_abajo
    this.dvDown=document.createElement('DIV');
    this.dvDown.style.position='absolute';
    this.dvDown.style.top='33px';
    this.dvDown.style.right='0';
    this.dvDown.className='scrollBar_Down';
    this.dvDown.onmousedown=function(){
        self.timeoutDown=setTimeout(self.goDown, 5);
    };
    this.dvDown.onmouseup=function(){
        self.timeoutDown=clearTimeout(self.timeoutDown);
    };
    this.dvDown.onmouseout=function(){
        self.timeoutDown=clearTimeout(self.timeoutDown);
    }
    this.dvScroll.appendChild(this.dvDown);
    //barra de arrastre
    this.dvDrag=document.createElement('DIV');
    this.dvDrag.className='scrollBar_Drag';
    this.dvDrag.style.position='absolute';
    this.dvDrag.right='0';
    this.dvDrag.onmousedown=function(e){
        //deshabilito la seleccion de texto
        document.onselectstart=self.disableselect;
        if (window.sidebar){
            document.onmousedown=self.disableselect
            document.onclick=self.reEnable
        }
        self.dragging=true;
        self.dvDrag.className='scrollBar_DragClick';
        if (document.all)
            self.clickY=event.offsetY;
        else
            self.clickY=e.layerY;
    }
    this.dvDrag.onmouseup=function(e){
        //habilito la seleccion de texto
        document.onselectstart=self.reEnable;
        if (window.sidebar){
            document.onmousedown=self.reEnable
            document.onclick=self.reEnable
        }
        self.dragging=false;
        self.dvDrag.className='scrollBar_Drag';
    }
    //calculo la posicion del elemento drag
    this.dvScroll.appendChild(this.dvDrag);
    var element=this.dvDrag;
    this.dvDragY = 0;
    this.clickY=0;
    do {
      this.dvDragY += element.offsetTop;
    } while (element=element.offsetParent)
    this.dvDragY=document.getElementById('content').offsetTop;
    this.dvDragY+=24;
    //this.dvDragPosY=this.dvDragY;
    this.dvDragPosY=0;
    
    //añado los eventos de arrastrar
    document.onmousemove=function(e){
        if (self.dragging){
            var posy=0;
            if (document.all){
                posy=event.clientY+document.documentElement.scrollTop;
            }else{
                posy=e.pageY;
            }
            posy=posy-self.dvDragY-self.clickY;
            //alert(self.dvDragY);
            if (posy<self.dvUp.offsetHeight)
                posy=self.dvUp.offsetHeight;
            else{
                if (posy>self.dvScroll.offsetHeight-self.dvDown.offsetHeight-self.dvDrag.offsetHeight)
                    posy=self.dvScroll.offsetHeight-self.dvDown.offsetHeight-self.dvDrag.offsetHeight;
                else
                    posy=posy;
            }
            //muevo el drag
            self.dvDrag.style.top=String(posy)+'px';
            self.dvDragPosY=posy;
            //muevo el contenido
            if (posy==self.dvUp.offsetHeight){
                posy=0;
            }else{
                posy=(self.relacion*posy)*-1;
                if (posy>0)
                    posy=0;
                else{
                    if (posy<(self.dvContent.offsetHeight-self.dvMask.offsetHeight)*-1)
                        posy=parseInt(self.dvContent.offsetHeight-self.dvMask.offsetHeight)*-1;
                }
            }
            self.dvContent.style.top=String(posy)+'px';
        }else{

        }
    }
        
    this.mueveContenido=function(){
        var posy=0;
        self.dvDrag.style.top=String(self.dvDragPosY)+'px';
        if (self.dvDragPosY==self.dvUp.offsetHeight){
            posy=0;
        }else{
            posy=parseInt(self.relacion*self.dvDragPosY)*-1;
            if (posy>0)
                posy=0;
            else{
                if (posy<(self.dvContent.offsetHeight-self.dvMask.offsetHeight)*-1)
                    posy=(self.dvContent.offsetHeight-self.dvMask.offsetHeight)*-1;
            }
        }
        self.dvContent.style.top=String(posy)+'px';
    }
    document.onmouseup=function(e){
        //habilito la seleccion de texto
        document.onselectstart=self.reEnable;
        if (window.sidebar){
            document.onmousedown=self.reEnable
            document.onclick=self.reEnable
        }
        self.dragging=false;
        self.dvDrag.className='scrollBar_Drag';
    }
    //añado el evento de la rueda para firefox
    if (this.dvContent.addEventListener)
        this.dvContent.addEventListener('DOMMouseScroll', function(event){
            var delta;
            if (event.wheelDelta) { /* IE/Opera. */
                delta = event.wheelDelta/120;
                /**In Opera 9, delta differs in sign as compared to IE. */
                if (window.opera)
                    delta = -delta;
            } else if (event.detail) { /** Mozilla case. */
                /** In Mozilla, sign of delta is different than in IE. * Also, delta is multiple of 3.*/
                delta = -event.detail/3;
            }
            delta=delta*15*-1;
            self.dvDragPosY=self.dvDragPosY+delta;
            if (self.dvDragPosY<self.dvUp.offsetHeight){
                self.dvDragPosY=self.dvUp.offsetHeight;
            }
            if (self.dvDragPosY+self.dvDrag.offsetHeight>self.dvScroll.offsetHeight-self.dvDown.offsetHeight){
                self.dvDragPosY=self.dvScroll.offsetHeight-self.dvDown.offsetHeight-self.dvDrag.offsetHeight;
            }
            self.mueveContenido();
            event.returnValue = false;
        }, false);
    //añado el evento de la rueda para explorer
    this.dvContent.onmousewheel = function(){
        //event=window.event;
        var delta;
        if (event.wheelDelta) { /* IE/Opera. */
            delta = event.wheelDelta/120;
            /** In Opera 9, delta differs in sign as compared to IE. */
            if (window.opera)
                delta = -delta;
        } else if (event.detail) { /** Mozilla case. */
            /** In Mozilla, sign of delta is different than in IE. * Also, delta is multiple of 3.*/
            delta = -event.detail/3;
        }
        delta=delta*15*-1;
        self.dvDragPosY=self.dvDragPosY+delta;
        if (self.dvDragPosY<self.dvUp.offsetHeight){
            self.dvDragPosY=self.dvUp.offsetHeight;
        }
        if (self.dvDragPosY+self.dvDrag.offsetHeight>self.dvScroll.offsetHeight-self.dvDown.offsetHeight){
            self.dvDragPosY=self.dvScroll.offsetHeight-self.dvDown.offsetHeight-self.dvDrag.offsetHeight;
        }
        self.mueveContenido();
        event.returnValue = false;
    }
    
    this.dvMask.appendChild(this.dvScroll);
    
    this.dvContent.style.width=ancho-this.dvScroll.offsetWidth+'px';
    
    //si el drag no tiene alto, lo calculo
    if (this.dvDrag.offsetHeight==0){
        aux=this.dvContent.offsetHeight-this.dvMask.offsetHeight;
        if (aux<0){
            this.dvScroll.style.display='none';
        }else{
            if (aux<this.dvScroll.offsetHeight){
                this.dvDrag.style.height=(this.dvScroll.offsetHeight-aux)+'px';
            }else{
                this.dvDrag.style.height=parseInt(this.dvScroll.offsetHeight/(aux/this.dvScroll.offsetHeight))+'px';
            }
        }
    }
    
    //calculo la relación movimiento del drag-movimiento del texto
    this.relacion=(this.dvContent.offsetHeight-this.dvMask.offsetHeight)/(this.dvScroll.offsetHeight-this.dvUp.offsetHeight-this.dvDown.offsetHeight-this.dvDrag.offsetHeight);
    this.relacionIns=(this.dvScroll.offsetHeight-this.dvUp.offsetHeight-this.dvDown.offsetHeight-this.dvDrag.offsetHeight)/(this.dvContent.offsetHeight-this.dvMask.offsetHeight);
    //pongo la barra de arastre en su posicion inicial
    this.dvDrag.style.top=String(this.dvUp.offsetHeight)+'px';
    
    this.goUp=function(){
        var pos=parseInt(self.dvContent.style.top.substr(0, self.dvContent.style.top.length-2));
        if (pos+5<0){
            pos=pos+5;
            self.dvContent.style.top=String(pos)+'px';
            self.timeoutUp=setTimeout(self.goUp, 5);
            self.dvDragPosY=parseInt(pos*self.relacionIns)*-1+self.dvUp.offsetHeight;
            self.dvDrag.style.top=self.dvDragPosY+'px';
        }else{
            self.dvContent.style.top='0px';
            self.dvDragPosY=self.dvUp.offsetHeight;
            self.dvDrag.style.top=self.dvDragPosY+'px';
        }
    }
    
    this.goDown=function(){
        var pos=parseInt(self.dvContent.style.top.substr(0, self.dvContent.style.top.length-2));
        var innerAlto=parseInt(alto)-self.dvContent.offsetHeight;
        if (pos-5>innerAlto){
            pos=pos-5;
            self.dvContent.style.top=String(pos)+'px';
            self.timeoutDown=setTimeout(self.goDown, 5);
            self.dvDragPosY=parseInt(pos*self.relacionIns)*-1+self.dvUp.offsetHeight;
            self.dvDrag.style.top=self.dvDragPosY+'px';
        }else{
            self.dvContent.style.top=String(innerAlto)+'px';
            self.dvDragPosY=self.dvScroll.offsetHeight-self.dvDown.offsetHeight-self.dvDrag.offsetHeight;
            self.dvDrag.style.top=self.dvDragPosY+'px';
        }
        
    }
    //funciones que habilitan o deshabilitan la seleccion de texto, ya que al arrastar el scroll se selecciona el texto
    this.disableselect=function(e){
        return false
    }
    this.reEnable=function(){
        return true
    }
    
    //accion inicial
    this.irSeleccionado=function(){
        if (document.all)
            var ul = self.dvContent.childNodes[0];
        else
            var ul = self.dvContent.childNodes[1];
        var sel = new Object();
        //obtengo el li seleccionado
        for (i=0;i<ul.childNodes.length;i++){
            if (ul.childNodes[i].tagName=='LI'){
                if (ul.childNodes[i].className=='sel'){
                    sel=ul.childNodes[i]
                    i=ul.childNodes.length;
                }
            }
        }
        if (sel.tagName=='LI'){
            //posicion y del elemento seleccionado
            var posy=sel.offsetTop;
            if (self.dvContent.offsetHeight-posy<self.dvMask.offsetHeight)
                posy=self.dvContent.offsetHeight-self.dvMask.offsetHeight;
            posy=posy*-1;
            
            self.dvContent.style.top=String(posy)+'px';
            self.dvDragPosY=parseInt(posy/self.relacion)*-1;
            self.dvDrag.style.top=String(self.dvDragPosY)+'px';
        }
    }
    
    this.irSeleccionado();
}