<Script content = "text/javascript">
Var iMouseDown = false;
Var dragObject = null;
Number. prototype. NaN0 = function () {return isNaN (this )? 0: this ;}
// Demo 0 variables
Var DragDrops = [];
Var curTarget = null;
Var lastTarget = null;
Function makeDraggable (item ){
If (! Item) return;
Item. onmousedown = function (ev ){
DragObject = this;
MouseOffset = getMouseOffset (this, ev );
Return false;
}
}
Function getMouseOffset (target, ev ){
Ev = ev | window. event;
Var docPos = getPosition (target );
Var mousePos = mouseCoords (ev );
Return {x: mousePos. x-docPos. x, y: mousePos. y-docPos. y };
}
Function getPosition (e ){
Var left = 0;
Var top = 0;
While (e. offsetParent ){
Left + = e. offsetLeft + (e. currentStyle? (ParseInt (e. currentStyle. borderLeftWidth). NaN0 (): 0 );
Top + = e. offsetTop + (e. currentStyle? (ParseInt (e. currentStyle. borderTopWidth). NaN0 (): 0 );
E = e. offsetParent;
}
Left + = e. offsetLeft + (e. currentStyle? (ParseInt (e. currentStyle. borderLeftWidth). NaN0 (): 0 );
Top + = e. offsetTop + (e. currentStyle? (ParseInt (e. currentStyle. borderTopWidth). NaN0 (): 0 );
Return {x: left, y: top };
}
Function mouseCoords (ev ){
If (ev. pageX | ev. pageY ){
Return {x: ev. pageX, y: ev. pageY };
}
Return {
X: ev. clientX + document. body. scrollLeft-document. body. clientLeft,
Y: ev. clientY + document. body. scrollTop-document. body. clientTop
};
}
Function mouseDown (ev ){
Ev = ev | window. event;
Var target = ev.tar get | ev. srcElement;
If (target. onmousedown | target. getAttribute ('dragobj ')){
Return false;
}
}
Function mouseUp (ev ){
// DragObject = null;
If (dragObject ){
Ev = ev | window. event;
Var mousePos = mouseCoords (ev );
Var dT = dragObject. getAttribute ('droptarget ');
If (dT ){
Var targObj = document. getElementById (dT );
Var objPos = getPosition (targObj );
If (mousePos. x> objPos. x) & (mousePos. y> objPos. y)
& (MousePos. x <(objPos. x + parseInt (targObj. offsetWidth )))
& (MousePos. y <(objPos. y + parseInt (targObj. offsetHeight )))){
Var nSrc = targObj. getAttribute ('newsrc ');
If (nSrc ){
DragObject. src = nSrc;
SetTimeout (function (){
If (! DragObject |! DragObject. parentNode) return;
DragObject. parentNode. removeChild (dragObject );
DragObject = null;
}, ParseInt (targObj. getAttribute ('timeout ')));
} Else {
DragObject. parentNode. removeChild (dragObject );
}
}
}
}
DragObject = null;
IMouseDown = false;
}
Function mouseMove (ev ){
Ev = ev | window. event;
/*
We are setting target to whatever item the mouse is currently on
Firefox uses event.tar get here, MSIE uses event. srcElement
*/
Var target = ev.tar get | ev. srcElement;
Var mousePos = mouseCoords (ev );
If (dragObject ){
DragObject. style. position = 'absolute ';
DragObject. style. top = mousePos. y-mouseOffset. y;
DragObject. style. left = mousePos. x-mouseOffset. x;
}
// Track the current mouse state so we can compare against it next time
LMouseState = iMouseDown;
// This prevents items on the page from being highlighted while dragging
If (curTarget | dragObject) return false;
}
Function addDropTarget (item, target ){
Item. setAttribute ('droptarget', target );
}
Document. onmousemove = mouseMove;
Document. onmousedown = mouseDown;
Document. onmouseup = mouseUp;
Window. onload = function (){
MakeDraggable (document. getElementById ('dragimage9 '));
MakeDraggable (document. getElementById ('dragimage10 '));
MakeDraggable (document. getElementById ('dragimage11 '));
MakeDraggable (document. getElementById ('dragimage12 '));
AddDropTarget (document. getElementById ('dragimage9'), 'trashimage1 ');
AddDropTarget (document. getElementById ('dragimage10'), 'trashimage1 ');
AddDropTarget (document. getElementById ('dragimage11'), 'trashimage1 ');
AddDropTarget (document. getElementById ('dragimage12'), 'trashimage1 ');
}
</Script>
</Head>
<Body>
<Fieldset id = "Demo6" style = "height: 70px">
</Fieldset>