想在这个滚动条上加些功能，请帮帮忙！

进度条代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>xyProgressLG xo</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<SCRIPT>
 function xyProgressLG(xyID){
  this.xyProgressID = 'oProgress' + Math.random().toString().substr(2, 10) + xyID;  this.max = 0;
  this.min = 0;
 
  this.width = 100;
  this.height = 20;
  this.currPos = 0;
  this.outerBorderColor = "black";
  this.outerBackColor = "white";
  this.innerBorderColor = "";
  this.innerBackColor = "blue";
  this.TextColor = "red";  this.SetProgressTop = xySetProgressTop;
  this.SetProgressLeft = xySetProgressLeft;
  this.SetProgressWidth = xySetProgressWidth;
  this.SetProgressHeight = xySetProgressHeight;
  this.SetProgressBorderColor = xySetProgressBorderColor;
  this.SetProgressForeBorderColor = xySetProgressForeBorderColor;
  this.SetProgressBackColor = xySetProgressBackColor;
  this.SetProgressForeColor = xySetProgressForeColor;
  this.EnableProgressText = xyEnableProgressText;
  this.SetProgressTextFontSize = xySetProgressTextFontSize;
  this.SetProgressTextFontColor = xySetProgressTextFontColor;
  this.SetProgressTextFontFamily = xySetProgressTextFontFamily;  this.SetProgressMax = xySetProgressMax;
  this.SetProgressMin = xySetProgressMin;
  this.UpdatePosition = xyUpdatePosition;
  this.UpdateToPosition = xyUpdateToPosition;
  this.UpdatePersent = xyUpdatePersent;
  this.UpdateToPersent = xyUpdateToPersent;  xyProgressInit(this.xyProgressID);
  return this.xyProgressID;
 }
 function xyProgressInit(xyID){
  var div = document.createElement("div");
  div.id = xyID;
  div.style.position = "absolute";
  div.style.left = "100px";
  div.style.top = "100px";
  document.body.appendChild(div);  var pro = document.createElement("div");
  pro.style.position = "absolute";
  pro.style.left = "0px";
  pro.style.top = "0px";
  pro.style.fontSize= "0px";
  pro.style.width = "100px";
  pro.style.height = "20px";
  pro.style.border = "1px solid black";
  pro.style.background = "white";
  pro.style.zIndex = "100";
  div.appendChild(pro);  var proInner = document.createElement("div");
  proInner.id = xyID+"_Inner";
  proInner.style.position = "absolute";
  proInner.style.left = "1px";
  proInner.style.top = "1px";
  proInner.style.fontSize= "0px";
  proInner.style.width = "0px";
  proInner.style.height = "16px";
  proInner.style.border = "1px solid black";
  proInner.style.background = "blue";
  pro.style.zIndex = "102";
  pro.appendChild(proInner);  var text = document.createElement("div");
  text.style.position = "absolute";
  text.style.left = "50px";
  text.style.top = "2px";
  text.style.fontSize= "11px";
  text.style.width = "40px";
  text.style.height = "16px";
  text.style.zIndex = "103";
  div.appendChild(text);
 }
 function xySetProgressTop(pStyleTop){
  try{
   var e = document.all(this.xyProgressID);
   e.style.top = pStyleTop;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressLeft(pStyleLeft){
  try{
   var e = document.all(this.xyProgressID);
   e.style.left = pStyleLeft;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressWidth(pWidth){
  try{
   var e = document.all(this.xyProgressID);
   e.style.width = pWidth;
   eOuter = e.children(0);
   eOuter.style.width = pWidth;
   this.width = pWidth;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressHeight(pHeight){
  try{
   var e = document.all(this.xyProgressID);
   e.style.height = pHeight;
   eOuter = e.children(0);
   eInner = e.children(0).children(0);
   eOuter.style.height = pHeight;
   eInner.style.height = pHeight-4;
   this.height = pHeight;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressBorderColor(pColor){
  try{
   var e = document.all(this.xyProgressID);
   e = e.children(0);
   e.style.border = "1px solid "+pColor;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressForeBorderColor(pColor){
  try{
   var e = document.all(this.xyProgressID);
   e = e.children(0).children(0);
   e.style.border = "1px solid "+pColor;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressBackColor(pColor){
  try{
   var e = document.all(this.xyProgressID);
   e = e.children(0);
   e.style.background = pColor;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressForeColor(pColor){
  try{
   var e = document.all(this.xyProgressID);
   e = e.children(0).children(0);
   e.style.background = pColor;
  }catch(e){
   alert(e.description);
  }
 }
 function xyEnableProgressText(bEnable){
  try{
   var e = document.all(this.xyProgressID);
   eText = e.children(1);
   if(bEnable){
    eText.style.display = "none";
   }else{
    eText.style.display = "";
   }
   var pos = e.style.width;
   var sel = eText.style.width;
   pos = (pos-sel)/2;
   eText.style.left = pos;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressTextFontSize(pSize){
  try{
   var e = document.all(this.xyProgressID);
   e = e.children(1);
   e.style.fontSize = pSize;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressTextFontColor(pColor){
  try{
   var e = document.all(this.xyProgressID);
   e = e.children(1);
   e.style.fontColor = pColor;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressTextFontFamily(pFamily){
  try{
   var e = document.all(this.xyProgressID);
   e = e.children(1);
   e.style.fontFamily = pFamily;
  }catch(e){
   alert(e.description);
  }
 }
 function xySetProgressMax(pMax){
  this.max = pMax;
 }
 function xySetProgressMin(pMin){
  this.min = pMin;
 }
 function xyUpdatePosition(pPosition){   /*将progress增长或减小pPosition,其中,0<pPersent<max*/
  try{
   var max = this.max;
   var min = this.min;
   var e = document.all(this.xyProgressID);
   if(pPosition>max){
    return -1;
   }
   var len = this.width;
   var pos = this.currPos+(pPosition/(max-min))*len;
   eProgress = e.children(0).children(0);
   if(pos>=this.width){
    eProgress.style.width = this.width-4;
    this.currPos = pos;
   }else if(pos<=0){
    eProgress.style.width = 0;
    this.currPos = pos;
   }else{
    eProgress.style.width = pos;
    this.currPos = pos;
   }
   return this.currPos;
  }catch(e){
   alert(e.description);
   return -1;
  }
 }

解决方案 »

  1.   

    function xyUpdateToPosition(pPosition){   /*将progress更新到pPosition位置,其中,min<pPersent<max*/
      try{
       var max = this.max;
       var min = this.min;
       var e = document.all(this.xyProgressID);
       if(pPosition<min||pPosition>max){
        return -1;
       }
       var len = this.width;
       var pos = ((pPosition-min)/(max-min))*len;
       eProgress = e.children(0).children(0);
       if(pos>=this.width){
        eProgress.style.width = this.width-4;
        this.currPos = pos;
       }else if(pos<=0){
        eProgress.style.width = 0;
        this.currPos = pos;
       }else{
        eProgress.style.width = pos;
        this.currPos = pos;
       }
       return this.currPos;
      }catch(e){
       alert(e.description);
       return -1;
      }
     }
     function xyUpdatePersent(pPersent){   /*从当前位置增长或减小pPersent%,pPersent大于零:增长,否则,减小*/
      try{
       var e = document.all(this.xyProgressID);
       e = e.children(0).children(0);
       var len = this.width;
       var pos = this.currPos;
       len = len*pPersent/100;
       pos += len;
       if(pos>this.width||pos<0){
        return -1;
       }
       e.style.width = pos;
       this.currPos = pos;
       return this.currPos;
      }catch(e){
       alert(e.description);
       return -1;
      }
     }
     function xyUpdateToPersent(pPersent){   /*从当前位置增长或减小到pPersent%*/
      try{
       var e = document.all(this.xyProgressID);
       e = e.children(0).children(0);
       var len = this.width;
       var pos = len*pPersent/100;
       if(pos>this.width||pos<0){
        return -1;
       }
       e.style.width = pos;
       this.currPos = pos;
       return this.currPos;
      }catch(e){
       alert(e.description);
       return -1;
      }
     } function xyNewID(){
      var d = new Date();
      var t = "oDraw_"+d.getTime().toString();
      return t;
     }
    </SCRIPT><META content="MSHTML 6.00.2600.0" name=GENERATOR></HEAD>
    <BODY id=bodyID topMargin=0 onload=update()>
    <SCRIPT>
     var xy = new xyProgressLG("kitty");
     xy.SetProgressLeft(200)
     xy.SetProgressTop(200);
     xy.SetProgressWidth(200)
     xy.SetProgressHeight(20)
     xy.SetProgressMax(200)
     xy.SetProgressMin(50); 
    </SCRIPT><SCRIPT language=JavaScript>
    function update(){
     xy.UpdatePosition(10)
     setTimeout("update()",100);
    }</SCRIPT>
    <BUTTON onclick=xy.UpdateToPersent(20)>update</BUTTON><BUTTON 
    onclick=xy.UpdatePosition(10)>updatePosition</BUTTON><BUTTON 
    onclick=update()>autoUpdate</BUTTON> </BODY></HTML>