Question

I have an anchor tag that lives inside a draggable UI, which has a .click() function that fires if the anchor is clicked and the mouse moves more than 5 pixels, indicating the users intention to drag not follow the link.

I tried to put .unbind in the .mouseup, but it’s preventing the .click() from firing at all. Ideas?

Code below:

$('a').click(function(e){
  var anchorPos = e.pageX - $('#fake').position().left;
  var distance = e.pageX - anchorPos;
  if (Math.abs(distance) > 5) {e.preventDefault();return false;}
});

And then:

$(document).one('mouseup', function () {
  $(document).unbind();
  $('a').unbind();
...

I’m sure I’m missing something simple…

Answer 1

Have you tried:

$( ".selector" ).draggable({ cancel: 'button' });

From: http://jqueryui.com/demos/draggable/#option-cancel