make input element draggable after disabling it

I have an <input> element which I have "disabled" (using disabled:true) and for which I have removed selection (using .disableSelection()).

The <input> element is therefore not much more than a picture: non-interactive pixels. Because of that, I should be able to make the element draggable, as there is no chance of conflict with any another click event.

I've tried .draggable() naively, but that doesn开发者_如何学Go't work: http://jsfiddle.net/E26dY/

First you need to un-disable input and then use .draggable({cancel: null}) in your js. Live example: http://jsfiddle.net/E26dY/8/

HTML:

<input />

jQuery/JavaScript:

$('input').val('Drag me!').disableSelection().css('webkit-user-select','none').draggable({cancel: null});