Mousedown and Up not working

2
votes

I used mouseup/down/move to manually implement jQuery.draggable functionality. Everything was working fine until I tried to move my div inside a jQuery popup window.

After moving the div

dialogOpenMultiple("Title", "1234", "<div id=\"include\"></div>");
$('.autosize').appendTo('#include');

I faced two problems:

  1. Firstly, the cursor is not moving bellow my mouse cursor because of some issue with offset and pageX, pageY.

  2. While mousemove is working mouseup / drag / mousedown is not working because of the default browser's functionality which selects and tries to move the actual picture.

Please look the not working sample here:

- Sample

Working sample:

- Sample

2
javascriptjqueryhtmlcss
For me the not working sample works (but the input boxes don't) and the working sample does not work (but the input boxes do) - Different55
Uh, either FF3.6 or Opera 10.10 on Mac OS X 10.4.11. Now I'm using FF9 on Windows 7 and... same thing. - Different55
With FF8 in Ubuntu is working just fine. Really strange. I will check it tomorrow. Thanks mate. - glarkou

2 Answers

1
votes

1) Easily fixed using cursor css. This will give a much better user experience. cursor:url(linkCursor.png), pointer;

2) You can stop browser default actions by adding e.preventDefault() to your events.

1
votes

updated fiddle showing working draggable.

http://jsfiddle.net/NMpwU/1/

added e.preventDefault(); to mousedown function and changed the if (newdiv == null) to if (newdiv === null)