<!--

function vScroll( scrollname, div_name, speed  ) 
{ 
    /* 
        Before creating the object Ensure that window.document.getElementById is supported. 
        if not...don't do anything 
    */ 

    if( !window.document.getElementById ) 
    { 
        return; 
    } //-- ends if statement 

    this.control_width = "18"; 
    this.up_height = "18"; 
    this.down_height = "18"; 
    this.track_width = "4"; 
    this.track_margin_left = "6"; 
    this.track_background_color = "#cccccc"; 


    // Member Variable declarations 
    this.div_name = div_name; 
    this.name = scrollname; 
    this.scrollCursor = 0; 
    this.speed = speed; 
    this.timeoutID = 0; 
    this.div_obj = null; 
    this.up_name = "scroll_up" + this.name; 
    this.dn_name = "scroll_down" + this.name; 
    // Ends member variable declarations 


    var is_opera = ( window.navigator.userAgent.toLowerCase().indexOf( "opera" ) != -1 ); 
    var is_ie = ( window.navigator.userAgent.toLowerCase().indexOf( "msie" ) != -1 ) && !is_opera; 

    /* 
        Obtain a reference to element div_name 
    */ 
    this.div_obj = document.getElementById( this.div_name ); 

    // check if div_obj has a reference to an element within the document 
    if ( this.div_obj ) 
    { 
        //this.div_obj = div_obj; 
        this.div_obj.style.overflow = 'hidden'; 
        this.orig_width = parseInt(this.div_obj.style.width); 
        this.div_obj.style.width =  (this.orig_width - this.control_width)+"px"; 
        this.scroll_height = parseInt(this.div_obj.style.height); 
        this.track_height = (this.scroll_height - this.up_height - this.down_height); 
    } //-- ends if statement 



    document.write('<div id="control_box' + this.name + '" style="margin: -105px 0 0 205px; height:'+this.scroll_height+'px;width:'+this.control_width+'px; float:left;">'); 
    document.write('    <div id="scroll_up' + this.name + '" style="height:'+this.up_height+'px;width:'+this.control_width+'px;cursor:pointer;">'); 
    document.write('    up'); 
    document.write('    </div>'); 
    document.write('    <div id="track' + this.name + '" style="height:'+this.track_height+'px;width:'+this.track_width+'px;margin-left:'+this.track_margin_left+'px;background-color:'+this.track_background_color+';"></div>'); 
    document.write('    <div id="scroll_down' + this.name + '" style="height:'+this.down_height+'px;width:'+this.control_width+'px;cursor:pointer;">'); 
    document.write('    dn'); 
    document.write('    </div>'); 
    document.write('</div>'); 


    if( is_ie ) { 
        if (this.div_obj.style.styleFloat != "left") { 
                document.write('<div style="clear:both;"></div>'); 
        } 
    } else { 
        if (this.div_obj.style.cssFloat != "left") { 
                document.write('<div style="clear:both;"></div>'); 
        } 
    } 


    if ( this.div_obj ) 
    { 
        this.div_obj.style.styleFloat = 'left'; 
        this.div_obj.style.cssFloat = 'left'; 
    } 




    /* 
        Obtain a reference both this.up_name and this.dn_name from within the document 
    */ 

    this.div_up_obj = document.getElementById( this.up_name ); 
    this.div_dn_obj = document.getElementById( this.dn_name ); 

    // check if both reference this.div_up_obj & this.div_up_obj 
    // has successfully obtain references within the document 
   if (this.div_up_obj && this.div_dn_obj) 
    { 
        this.div_up_obj.onmouseover = function() { eval( scrollname + ".scrollUp();" ); }; 
        this.div_up_obj.onmouseout = function() { eval( scrollname + ".stopScroll();" ); }; 

        this.div_up_obj.style.display = "block"; 

        this.div_dn_obj.onmouseover = function() { eval( scrollname + ".scrollDown();"); }; 
        this.div_dn_obj.onmouseout = function() { eval( scrollname + ".stopScroll();" ); }; 

        this.div_dn_obj.style.display = "block"; 
    } //-- ends if statement 




    this.control_box = window.document.getElementById( "control_box" + this.id ); 

    // if this.control_box successfully references an element within the document, then show it . 
    if( this.control_box ) 
    { 
        this.control_box.style.display = "block"; 
    } //-- ends if statement 


    /* 
        onmouseout, clearTimeout so scrolling up or down stops. 
    */ 
    this.stopScroll = function() 
    { 
        clearTimeout(this.timeoutID); 
    } //-- ends object method stopScroll 
    var is_opera = ( window.navigator.userAgent.toLowerCase().indexOf( "opera" ) != -1 ); 
    if( is_opera ) 
    { 
        this.innerDiv = window.document.createElement( "DIV" ); 
        this.innerDiv.innerHTML = this.div_obj.innerHTML; 
        this.div_obj.innerHTML = ""; 
        this.div_obj.appendChild( this.innerDiv ); 
    } 
    this.scrollUp = function() 
    { 
        // check if browser is opera 

        if( is_opera ) 
        { 
            this.scrollCursor = (this.scrollCursor - this.speed) < 0 ? 0 : this.scrollCursor - this.speed; 

            this.innerDiv.style.marginTop = -this.scrollCursor + "px"; 
            this.timeoutID = setTimeout(this.name + ".scrollUp()", 60); 
            // terminate scrolling 
            if( this.scrollCursor == 0 ) 
            {    this.stopScroll(); } 
        } 
        else if (this.div_obj) 
        { 
            this.scrollCursor = (this.scrollCursor - this.speed) < 0 ? 0 : this.scrollCursor - this.speed; 
            this.div_obj.scrollTop = this.scrollCursor; 
            this.timeoutID = setTimeout(this.name + ".scrollUp()", 60); 
        } //-- ends if statement 
    } //-- ends Object method scrollUp 

    this.scrollDown = function() 
    { 
        if (this.div_obj) 
        { 
            this.scrollCursor += this.speed; 
            this.div_obj.scrollTop = this.scrollCursor ; 

            if( is_opera ) 
            { 
                this.innerDiv.style.marginTop = -this.scrollCursor + "px"; 
                this.timeoutID = setTimeout(this.name + ".scrollDown()", 60); 
                var now = this.innerDiv.offsetHeight; 
                /* 
                    when we need to know when to stop scrollDown. 
                    so we caclulate the difference between innerDiv offsetHeight, its margin, and offsetHeight of the div containing it. 

                */ 
                var dif = parseInt( this.innerDiv.offsetHeight ) + parseInt( this.innerDiv.style.marginTop ) - parseInt( document.getElementById( this.div_name ).offsetHeight ); 

                // to esure that the whole body of the innerDiv is displayed, 
                // we secroll until difference is -24. You can change this to suit your needs 
                if( dif < -24 ) 
                {    this.stopScroll(); }; 

            } //-- ends if 

            else if (this.div_obj.scrollTop == this.scrollCursor) 
            { 
                this.timeoutID = setTimeout(this.name + ".scrollDown()", 60); 

            } //-- ends if statement 
            else 
            { 
                this.scrollCursor = this.div_obj.scrollTop; 
            } //-- ends else 
        } //-- ends outer if statement 
    } //-- ends Object method scrollDown 

    /* 

    */ 
    this.resetScroll = function() 
    { 
        // check if this.div_obj points to an element in the document 
        if (this.div_obj) 
        { 
            this.div_obj.scrollTop = 0; 
            this.scrollCursor = 0; 
        } //-- ends if statement 
    } //-- ends Object method resetScroll 

} //-- ends declaration of object vScroll 

//-->
