drag function problem

[cleary1981]

Hi all,

I am using the drag function below which is from http://dunnbypaul.net/js_mouse/

I don't quite understand the code but was wondering if anyone knows how you would alter this code to so that objects being moved move a specified amount of pixels each time. Really the same functionality as snap in the scriptalicious drag drop function.

heres the drag function snippet.

function drag(e) // parameter passing is important for NS family 
{
  if (dragobj)
  {
    elex = orix + (mousex-grabx);
    eley = oriy + (mousey-graby);
    dragobj.style.position = "absolute";
    dragobj.style.left = (elex).toString(10) + 'px';
    dragobj.style.top  = (eley).toString(10) + 'px';
  }
  update(e);
  return false; // in IE this prevents cascading of events, thus text selection is disabled
}
 

[hsriat]

Is it like you want the drag to be disabled after a particular maximum number of pixels or you want the div to move at least a particular minimum number of pixels on each drag?

[cleary1981]

I want they div to move in jumps of 25px

[hsriat]

function drag(e) // parameter passing is important for NS family 
{
  if (dragobj)
  {
     var jumpX = mousex - grabx;
    var jumpY = mousey - graby;
    jumpX = Math.floor(jumpX / 25) * 25;
    jumpY = Math.floor(jumpY / 25) * 25;
    elex = orix + jumpX;
    eley = oriy + jumpY;
    dragobj.style.position = "absolute";
    dragobj.style.left = (elex).toString(10) + 'px';
    dragobj.style.top  = (eley).toString(10) + 'px';
  }
  update(e);
  return false; // in IE this prevents cascading of events, thus text selection is disabled
}
 

See if this works.

[cleary1981]

Thanks that worked. Much appreciated