Jquery - disable select when dragging

Question

I'm trying to do my own drag and drop function using jquery library. But everytime I mousedown on an image, then mousemove, my browser "highlights" or "selects" the image, which disrupts my mousemove operation.

How do I disable the select/highlight? I tried $('img').onselectstart = function() {return false;}, but that didn't work.

Answer 1

You could prevent the default behaviour of the dragstart event...

$('img').bind('dragstart', function(event) { event.preventDefault(); });

jsFiddle.

Answer 2

jQuery UI has an undocumented method that it uses to disable browser text selection. You can call it using this syntax:

$('IMG').disableSelection();

Remember that you need to be using jQuery UI (which I assume you are).