var Dragged = new Object();
Dragged.zIndex = 0;

function DragStart(event, Id) {
    var x, y;

    if (Id) {
        Dragged.Node = document.getElementById(Id);
    } else if (IsExplorer) {
        Dragged.Node = window.event.srcElement;
    } else if (IsNetscape) {
        Dragged.Node = event.target;
    }
    //document.title = Dragged.Node;

    if (Dragged.Node.nodeType == 3) Dragged.Node = Dragged.Node.parentNode;

    if (IsExplorer) {
        x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
        y = window.event.clientY + document.documentElement.scrollTop  + document.body.scrollTop;
    } else if (IsNetscape) {
        x = event.clientX + window.scrollX;
        y = event.clientY + window.scrollY;
    }

    Dragged.Node.style.border = '4px solid #ccc';
    Dragged.Node.style.cursor = 'move';
    Dragged.Node.style.position = 'relative';
    Dragged.StartX = x;
    Dragged.StartY = y;
    Dragged.StartL = parseInt(Dragged.Node.style.left, 10);
    Dragged.StartT  = parseInt(Dragged.Node.style.top,  10);

    if (isNaN(Dragged.StartL)) Dragged.StartL = 0;
    if (isNaN(Dragged.StartT)) Dragged.StartT = 0;

    Dragged.Node.style.zIndex = ++Dragged.zIndex;

    if (IsExplorer) {
        document.attachEvent("onmousemove", DragMove);
        document.attachEvent("onmouseup",   DragEnd);
        window.event.cancelBubble = true;
        window.event.returnValue = false;
    } else if (IsNetscape) {
        document.addEventListener("mousemove", DragMove,   true);
        document.addEventListener("mouseup",   DragEnd, true);
        event.preventDefault();
    }
}
function DragMove(event) {
    var x, y;

    if (IsExplorer) {
        x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft;
        y = window.event.clientY + document.documentElement.scrollTop  + document.body.scrollTop;
    } else if (IsNetscape) {
        x = event.clientX + window.scrollX;
        y = event.clientY + window.scrollY;
    }

    Dragged.Node.style.left = (Dragged.StartL + x - Dragged.StartX) + 'px';
    Dragged.Node.style.top  = (Dragged.StartT + y - Dragged.StartY) + 'px';

    if (IsExplorer) {
        window.event.cancelBubble = true;
        window.event.returnValue = false;
    } else if (IsNetscape) {
        event.preventDefault();
    }
}
function DragEnd(event) {
    Dragged.Node.style.border = '4px solid #fff';
    Dragged.Node.style.cursor = 'default';
    Dragged.Node = null;
    if (IsExplorer) {
        document.detachEvent('onmousemove', DragMove);
        document.detachEvent('onmouseup',   DragEnd);
    } else if (IsNetscape) {
        document.removeEventListener('mousemove', DragMove, true);
        document.removeEventListener('mouseup',   DragEnd,  true);
    }
}