ugrás a tartalomhoz

Drag a div - onmouseup

mahoo · 2010. Feb. 14. (V), 03.11
Problémám, hogy mozgatni szertenék egy div-et az egér segítségével, ami mozog is, de nem hajlandó elereszteni.

<html>
<head>
  <script>
      var cx=cy=-1;
      function down(event){
        document.getElementById('main').style.background='blue';
        cx=event.clientX;
        cy=event.clientY;
        move(event);
      }

      function up(){
        cx=cy=-1;
        document.getElementById('main').style.background='red';
      }

      function move(event){
        if(cx>0 && cy>0){
          document.getElementById('main').style.left=document.getElementById('main').offsetLeft+(event.clientX-cx);
          document.getElementById('main').style.top=document.getElementById('main').offsetTop+(event.clientY-cy);
          cx=event.clientX;
          cy=event.clientY;
        }
      }
    </script>
</head>
<body onmousemove="move(event);">
      <div id='main' style='width: 100px; height: 100px; background: red; position: absolute;' onmousedown="down(event);" onmouseup="up();"></div>
</body>
</html>


Már találtam külföldi fórumokon tökéletesen működő megoldásokat, de azok sokkal többet 'tudtak'. Ha megoldható, én ezt a kódot szeretném kiegészíteni minimálisan, hogy megértsem mi a gond ebben az esetben.
Előre is köszi!
 
1

Kész megoldás

Joó Ádám · 2010. Feb. 14. (V), 14.20
Ha nem ragaszkodsz hozzá, hogy te magad faragd össze, akkor talán érdemesebb egy kész, tesztelt megoldást használni, pl. JQuery-t.
2

Az az 'gond', hogy szeretnék

mahoo · 2010. Feb. 14. (V), 15.04
Az az 'gond', hogy szeretném inkább magam összerakni lépésről-lépésre a progit! Szerintem elég sokat lehet ezekből tanulni még akkor is, ha nem lesz annyira profi, mint egy jquery-s megoldás!
3

én ezt úgy próbálnám meg,

mgergo90 · 2010. Feb. 15. (H), 11.32
én ezt úgy próbálnám meg, hogy a mozgatandó divet beraknám egy változóba a mousedown eseménykor, majd a mouse up eseménynél ennek a változónak null értéket adnék.
4

Siker :)

mahoo · 2010. Feb. 16. (K), 21.05
Csak tanulságként irom le, hogy mi volt a gond:
amint a div tartalma nem volt üres, hanem pl. betettem egy szóközt akkor már ment, ha töröltem ismét nem ment. Ennyit erről! A hajamat befontam mire rajöttem...