Joachim: Warum funktioniert das Drag&drop nicht richtig?

Beitrag lesen

SELF-Forum

Warum funktioniert das Drag&drop nicht richtig?

Joachim Homepage des Autors
– Informationen zu den Bewertungsregeln

Hi,

Hat jemand eine Idee, woran das liegt?

abgesehen von dem fehlenden "return false" musst Du auch noch den Unterschied zwischen Mousposition und Ecke oben-links ausgleichen. Habs mal leicht modifiziert angehängt, denn ich nehme mal an, Dir gehts auch um den Lerneffekt...

Gruesse, Joachim

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<script type="text/javascript">
    var dragobjekt = null;
    var dragx = 0;
    var dragy = 0;
    var diffx = 0;
    var diffy = 0;
    var posx = 0;
    var posy = 0;

function draginit() {
        document.onmousemove = drag;
        document.onmouseup = dragstop;
    }

function dragstart(e,element) {
        diffx =  e.layerX? e.layerX : e.offsetX;
        diffy =  e.layerY? e.layerY : e.offsetY;
        dragobjekt = element;
        dragx = posx - dragobjekt.offsetLeft;
        dragy = posy - dragobjekt.offsetTop;
        return false;
    }

function dragstop() {
        dragobjekt=null;
    }

function drag(ereignis) {
        if(dragobjekt == null) return;
        posx = (document.all? window.event.clientX : ereignis.pageX) -diffx;
        posy = (document.all? window.event.clientY : ereignis.pageY) -diffy;
        neuposx = (posx - dragx)*-1;
        neuposy = (posy - dragy)*-1;
        dragobjekt.style.left = (posx - dragx) + "px";
        dragobjekt.style.top = (posy - dragy) + "px";
    }
</script>
<style type="text/css">
    #clipdiv {
        position: absolute;
        width: 100px;
        height: 100px;
        background: red;
    }
</style>
</head>
<body onLoad="draginit()">
    <div onmousedown="dragstart(event,this)" id="clipdiv"></div>
</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln