Javascript una clase de arrastre
Autor：Eve Cole
Fecha de actualización：2009-06-11 16:31:49
<HTML>
<CABEZA>
<IDIOMA DE ESCRITURA="JavaScript">
<!--
var Arrastrar = {
xx: 0,
si: 0,
ejemplo: 0,
oy: 0,
lx: 0,
ly: 0,
desplazamientoX: 0,
compensaciónY: 0,
cdom: nulo,
arrastrable: falso,
arrastrarFun: nulo,
tempDrag: función(){
Arrastrar.arrastrar.llamar(Arrastrar);
},
caché: {},
putCache: función(clave,v){
this.cache[clave] = v;
},
getCache: función (clave) {
devolver this.cache[clave];
},
arrastrarInicio: función(dfun,fn){
intentar{
si(!this.dragAble){
this.cdom = evento.srcElement?event.srcElement:event.target;
this.cdom.setCapture(verdadero);
this.sx = evento.screenX;
this.sy = evento.pantallaY;
this.ex = evento.screenX;
this.ey = evento.pantallaY;
this.lx = evento.screenX;
this.ly = evento.pantallaY;
this.dragAble = verdadero;
this.dragFun = dfun?dfun:null;
si(función){función();}
this.cdom.attachEvent("onmousemove",Drag.tempDrag);
}
}captura(e){
this.dragEnd();
}
},
arrastrar: función(){
intentar{
si(this.dragAble){
this.ex = evento.screenX;
this.ey = evento.pantallaY;
this.offsetX = this.ex - this.lx;
this.offsetY = this.ey - this.ly;
si(this.dragFun){this.dragFun();}
este.lx = este.ex;
esto.ly = esto.ey;
}
}
atrapar(e){
this.dragEnd(nulo);
}
},
arrastrarEnd: función(fn){
si(this.dragAble){
this.cdom.detachEvent("onmousemove",Drag.tempDrag);
this.cdom.releaseCapture();
this.ex = evento.screenX;
this.ey = evento.pantallaY;
this.dragAble = falso;
si(función){función();}
}
this.releaseDrag();
},
soltarArrastrar: función(){
esto.ex = 0;
this.ey = 0;
esto.sx = 0;
esto.sy = 0;
this.cdom = nulo;
this.dragAble = falso;
this.dragFun = nulo;
this.cache = {};
}
};
inicio de función(){
var d = Drag.cdom.cloneNode(verdadero);
var pos = getBodyPos(Drag.cdom);
con(d.estilo){
posición="absoluta";
izquierda=pos.izquierda;
arriba=pos.arriba;
filtro='Alfa(Opacidad="30")';
}
Arrastrar.putCache("alo",d);
documento.body.appendChild(d);
}
función ing(){
var offx = Arrastrar.offsetX;
var offy = Arrastrar.offsetY;
var a = Drag.getCache("alo");
var l = to.offsetLeft;
var t = to.offsetTop;
con(al.estilo){
izquierda=l+offx;
arriba=t+offy;
}
}
fin de función(){
var cdom = Arrastrar.cdom;
varalo = Drag.getCache("alo");
con(cdom.estilo)
{
izquierda=alo.offsetIzquierda;
top=alo.offsetTop;
posición="absoluta";
}
si(alo)
documento.cuerpo.removeChild(alo);
}
función getBodyPos(obj){
intentar{
var l = obj.offsetLeft;
var t = obj.offsetTop;
while(obj.parentElement!= documento.cuerpo){
obj = obj.parentElement;
var tl = obj.offsetLeft;
var tt = obj.offsetTop;
l += tl;
t += tt;
}
devolver {izquierda:l,arriba:t};
}captura(e){
alerta(e.mensaje);
}
}
//-->
</SCRIPT>
</CABEZA>
<CUERPO>
<div style="borde:sólido 1 #7FFFD4;ancho:300;alto:150;fondo:#3399FF;cursor:mover;" onmousedown="Drag.dragStart(ing,start)" onmouseup="Drag.dragEnd(end)">
Probar objeto de arrastre
</div>
</CUERPO>
</HTML>
