复制代码 代码如下:
functionJObj(){}
JObj.$c=function(tag){returndocument.createElement(tag)};
JObj.$=function(id){returndocument.getElementById(id)};
JObj.isRate=function(pRateString){
if(!isNaN(pRateString))returnfalse;
if(pRateString.substr(pRateString.length-1,1)!="%")
returnfalse;
if(isNaN(pRateString.substring(0,pRateString.length-1)))
returnfalse;
returntrue;
}

functionJPos(){}
JPos.getAbsPos=function(pTarget){
varx_=y_=0;
while(pTarget.offsetParent){
x_+=pTarget.offsetLeft;
y_+=pTarget.offsetTop;
pTarget=pTarget.offsetParent;
}
x_+=pTarget.offsetLeft;
y_+=pTarget.offsetTop;
return{x:x_,y:y_};
}

JPos.getMousePos=function(evt){
varx_=y_=0;
evt=evt||window.event;
if(evt.pageX||evt.pageY){
x_=evt.pageX;
y_=evt.pageY;
}else{
x_=evt.clientX+document.body.scrollLeft-document.body.clientLeft;
y_=evt.clientY+document.body.scrollTop-document.body.clientTop;
}

return{x:x_,y:y_};
}



<!--

functionJPos(){

}

JPos.getAbsPos=function(pTarget){
var_x=0;
var_y=0;
while(pTarget.offsetParent){
_x+=pTarget.offsetLeft;
_y+=pTarget.offsetTop;
pTarget=pTarget.offsetParent;
}
_x+=pTarget.offsetLeft;
_y+=pTarget.offsetTop;

return{x:_x,y:_y};
}

JPos.getMousePos=function(evt){
var_x,_y;
evt=evt||window.event;
if(evt.pageX||evt.pageY){
_x=evt.pageX;
_y=evt.pageY;
}else{
_x=evt.clientX+document.body.scrollLeft-document.body.clientLeft;
_y=evt.clientY+document.body.scrollTop-document.body.clientTop;
}
return{x:_x,y:_y};
}

functionJTrackBar(pParent){
varself=this;

var$=function(pId){
returndocument.getElementById(pId);
}

var$c=function(pTag){
returndocument.createElement(pTag);
}

vartrackBarType;//V&H
if((typeofpParent).toUpperCase()=="OBJECT")
varbody=pParent;
else
varbody=$(pParent)||document.body;
varoOutline=null;
varoTrackArea=null;
varoBtnPointer=null;
varoArrBtnLeft=oArrBtnRight=oArrBtnUp=oArrBtnDown=null;

varinDrag=false;
vardragStartPos=null;

varmaxPosition=100;//最大刻度
varminPosition=0;//最小刻度
varbase=0;
varposition=0;//当前位置
vartrackFrequence=10;//点击一次移动多少刻度

vardefaultArrowW=defaultArrowH=15;//OnlyforIE!

this.setRange=function(pMin,pMax){
maxPosition=Math.max(pMin,pMax);
minPosition=Math.min(pMin,pMax);

maxPosition-=minPosition;
base=minPosition;
minPosition=0;
}

varoutlineWidth,trackAreaWidth,preFrequenceWidth;
varoutlineHeight,trackAreaHeight,preFrequenceHeight;

this.onChange=newFunction();

vargetRunStyle=function(pObj,pProperty){
try{
if(pObj.currentStyle)
returneval("pObj.currentStyle."+pProperty);
else
returndocument.defaultView.getComputedStyle(pObj,"").getPropertyValue(pProperty);
}catch(e){
alert(e);
}
}


varcreateOutline=function(pWH){
oOutline=$c("DIV");
body.appendChild(oOutline);
oOutline.className="JTrackBarStand";
if(trackBarType=="H")
oOutline.style.width=pWH+"px";
elseif(trackBarType=="V")
oOutline.style.height=pWH+"px";
oOutline.style.overflow="hidden";
}

varcreateArrBtn=function(pDirection){
vararrBtn=$c("DIV");
switch(pDirection){
case"LEFT":
arrBtn.className="btnLeft";
arrBtn.style.styleFloat="left";
arrBtn.style.cssFloat="left";
break;
case"RIGHT":
arrBtn.className="btnRight";
arrBtn.style.styleFloat="left";
arrBtn.style.cssFloat="left";
break;
case"UP":
arrBtn.className="btnUp";
break;
case"DOWN":
arrBtn.className="btnDown";
break;
}

arrBtn.direction=pDirection;
arrBtn.onclick=arrBtn_click;
returnarrBtn;
}

vararrBtn_click=function(evt){

evt=window.event||evt;
varo=evt.srcElement||evt.target;

switch(o.direction){
case"LEFT":
case"UP":
self.setPositionBy(-trackFrequence);
break;
case"RIGHT":
case"DOWN":
self.setPositionBy(trackFrequence);
break;
}
}

vartrackarea_click=function(evt){
evt=window.event||evt;
varmPos=JPos.getMousePos(evt);

varpos_=JPos.getAbsPos(oTrackArea);

if(trackBarType=="H"){
varw_=parseInt(getRunStyle(oBtnPointer,"width"));
self.setPosition(parseInt((mPos.x-pos_.x)/preFrequenceWidth));
}else{
varh_=parseInt(getRunStyle(oBtnPointer,"height"));
self.setPosition(parseInt((mPos.y-pos_.y)/preFrequenceHeight));
}
}

varcreateHTrackArea=function(){
varw_=parseInt(getRunStyle(oArrBtnLeft,"width"));
if(isNaN(w_))w_=defaultArrowW;

trackAreaWidth=outlineWidth-2*w_;
preFrequenceWidth=trackAreaWidth/(maxPosition-minPosition);

oTrackArea=$c("DIV");
oOutline.appendChild(oTrackArea);

oTrackArea.onclick=trackarea_click;

oTrackArea.className="trackAreaH";
oTrackArea.style.width=trackAreaWidth+"px";
oTrackArea.style.styleFloat="left";
oTrackArea.style.cssFloat="left";
}

varcreateVTrackArea=function(){
varh_=parseInt(getRunStyle(oArrBtnUp,"height"));
if(isNaN(h_))h_=defaultArrowH;
trackAreaHeight=outlineHeight-2*h_;
preFrequenceHeight=trackAreaHeight/(maxPosition-minPosition);

oTrackArea=$c("DIV");
oOutline.appendChild(oTrackArea);

oTrackArea.onclick=trackarea_click;
oTrackArea.className="trackAreaV";
oTrackArea.style.height=trackAreaHeight+"px";
}

varrecalcTrackArea=function(){
if(trackBarType=="H"){
varw_=parseInt(getRunStyle(oArrBtnLeft,"width"));
if(isNaN(w_))w_=defaultArrowW;

trackAreaWidth=outlineWidth-2*w_;
preFrequenceWidth=trackAreaWidth/maxPosition;

oTrackArea.style.width=trackAreaWidth+"px";
}else{
varh_=parseInt(getRunStyle(oArrBtnUp,"height"));
if(isNaN(h_))h_=defaultArrowH;

trackAreaHeight=outlineHeight-2*h_;
preFrequenceHeight=trackAreaHeight/maxPosition;
oTrackArea.style.height=trackAreaHeight+"px";
}
}

varpointer_mousedown=function(evt){
inDrag=true;
dragStartPos=JPos.getMousePos(evt);
body.onmousemove=pointer_mousemove;
body.onmouseup=pointer_mouseup;
body.onmouseout=pointer_mouseout;
}

varpointer_mousemove=function(evt){
if(!inDrag)return;
varmPos=JPos.getMousePos(evt);
varpos_=JPos.getAbsPos(oTrackArea);

if(trackBarType=="H")
self.setPosition(parseInt((mPos.x-pos_.x)/preFrequenceWidth));
else
self.setPosition(parseInt((mPos.y-pos_.y)/preFrequenceHeight));
}

varpointer_mouseup=function(){
inDrag=false;
}

varpointer_mouseout=function(){
//inDrag=false;
}

varcreateHPointer=function(){
oBtnPointer=$c("DIV");
oOutline.appendChild(oBtnPointer);
oBtnPointer.onmousedown=pointer_mousedown;

oBtnPointer.className="btnPointerH";
oBtnPointer.style.position="absolute";

varw_=parseInt(getRunStyle(oBtnPointer,"width"));
if(isNaN(w_))w_=defaultArrowW;

varpos_=JPos.getAbsPos(oTrackArea);
oBtnPointer.style.left=pos_.x-w_/2+"px";
oBtnPointer.style.top=pos_.y+"px";
oBtnPointer.style.cssText+="left:"+(pos_.x-w_/2)+"px;top:"+pos_.y+"px;";
}

varcreateVPointer=function(){
oBtnPointer=$c("DIV");
oOutline.appendChild(oBtnPointer);
oBtnPointer.onmousedown=pointer_mousedown;

oBtnPointer.className="btnPointerV";
oBtnPointer.style.position="absolute";
varh_=parseInt(getRunStyle(oBtnPointer,"height"));
if(isNaN(h_))h_=defaultArrowH;

varpos_=JPos.getAbsPos(oTrackArea);
oBtnPointer.style.top=pos_.y-h_/2+"px";
oBtnPointer.style.left=pos_.x+"px";
oBtnPointer.style.cssText+="left:"+pos_.x+"px;top:"+(pos_.y-h_/2)+"px";
}


this.createHTrackBar=function(pWidth){
trackBarType="H";
outlineWidth=pWidth;
createOutline(pWidth);

oArrBtnLeft=createArrBtn("LEFT");
oOutline.appendChild(oArrBtnLeft);

createHTrackArea();

oArrBtnRight=createArrBtn("RIGHT");
oOutline.appendChild(oArrBtnRight);

createHPointer();
}

this.createVTrackBar=function(pHeight){
trackBarType="V";
outlineHeight=pHeight;
createOutline(pHeight);

oArrBtnUp=createArrBtn("UP");
oOutline.appendChild(oArrBtnUp);

createVTrackArea();

oArrBtnDown=createArrBtn("DOWN");
oOutline.appendChild(oArrBtnDown);

createVPointer();
}


this.setPositionBy=function(pPosition){
position+=pPosition;
self.setPosition(position);
}

this.setPosition=function(pPosition){
position=pPosition;
if(position>maxPosition)
position=maxPosition;
if(position<minPosition)
position=minPosition;

varpos_=JPos.getAbsPos(oTrackArea);

if(trackBarType=="H"){
varw_=parseInt(getRunStyle(oBtnPointer,"width"));
if(isNaN(w_))w_=defaultArrowW;

oBtnPointer.style.left=pos_.x-w_/2+preFrequenceWidth*position+"px";
}elseif(trackBarType=="V"){
varh_=parseInt(getRunStyle(oBtnPointer,"height"));
if(isNaN(h_))h_=defaultArrowH;
oBtnPointer.style.top=pos_.y-h_/2+preFrequenceHeight*position+"px";
}

doChange();
}

vardoChange=function(){
self.onChange(position+base);
}

this.getPosition=function(){
returnposition;
}

this.setSkin=function(pSkin){
oOutline.className=pSkin;
recalcTrackArea();
self.setPosition(minPosition)
}
}



functionJScroll(pWidth,pHeight,pBody){
varself=this;
varoOutline=null;
varoContentArea=null;
varoTrackBarArea=null;

this.trackBar=null;

varw=JObj.isRate(pWidth)?pWidth:(!isNaN(pWidth)?pWidth+"px":"100%");
varh=JObj.isRate(pHeight)?pHeight:(!isNaN(pHeight)?pHeight+"px":"100%");

vardb_=JObj.$(pBody)||document.body;

varcreateOutline=function(){
oOutline=JObj.$c("DIV");
oOutline.className="oOutline";
db_.appendChild(oOutline);
with(oOutline.style){
width=w;
height=h;
overflow="hidden";
}

oContentArea=JObj.$c("DIV");
oOutline.appendChild(oContentArea);
oContentArea.className="oContentArea";
with(oContentArea.style){
width=oOutline.clientWidth-25+"px";
height=oOutline.clientHeight+"px";
styleFloat="left";
cssFloat="left";
}
}

this.create=function(){
createOutline();
}

varcreateTrackBar=function(){
oTrackBarArea=JObj.$c("DIV");
oOutline.appendChild(oTrackBarArea);
with(oTrackBarArea.style){
width=20+"px";
height=oContentArea.style.height;
stylefloat="left";
cssFloat="left";
overflow="hidden";
}
self.trackBar=newJTrackBar(oTrackBarArea);
self.trackBar.onChange=function(pTrackPosition){
oContentArea.scrollTop=pTrackPosition;
}

self.trackBar.setRange(0,oContentArea.scrollHeight);
self.trackBar.createVTrackBar(oTrackBarArea.clientHeight);
self.trackBar.setSkin("JTrackBarSky");
}

this.addContextArea=function(pId){
oContentArea.appendChild(JObj.$(pId));
oContentArea.style.overflow="hidden";

createTrackBar();
}

this.setSkin=function(pSkin){
self.trackBar.setSkin(pSkin)
}
}

打包文件下载