javascript drag and drop

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Ovako našao sam neku skriptu:

<html> <head> <title>Drag-and-Drop</title> <script type="text/javascript"> var dragobjekt = null; var dragx = 0; var dragy = 0; // Pozicija misa var posx = 0; var posy = 0; function draginit() {   document.onmousemove = drag;   document.onmouseup = dragstop; } function dragstart(element) {   dragobjekt = element;   dragx = posx - dragobjekt.offsetLeft;   dragy = posy - dragobjekt.offsetTop; } function dragstop() {   dragobjekt=null; } function drag(event) {   posx = document.all ? window.event.clientX : event.pageX;   posy = document.all ? window.event.clientY : event.pageY;   if(dragobjekt != null) {     dragobjekt.style.left = (posx - dragx) + "px";     dragobjekt.style.top = (posy - dragy) + "px";   } } //--> </script> </head> <body onload="draginit()"> <div onmousedown="dragstart(this)" style="position:absolute;top:0px;left:0px;height:100px;width:100px;background:#ff0000"> </div> <div onmousedown="dragstart(this)" style="position:absolute;top:200px;left:0px;height:100px;width:100px;background:#00ff00"> </div> </body> </html>

Radi dobro, ali kako da je ograničim? Ne želim da se objekat pomera van granice preglednika.
Npr. da se ne dešava ovo:


Inače ne mora baš ova skripta, može i neka druga (npr. [Link mogu videti samo ulogovani korisnici]) samo je bitno da mogu da pomeram objekat i da ima ograničen prostor po kojem može da se kreće.

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Napisano: 09 Okt 2014 15:20

Koristi opciju containment.

[Link mogu videti samo ulogovani korisnici]

Dopuna: 09 Okt 2014 15:21

Što ne radiš u jQuery, mnogo je brže i jednostavnije?