drag and drop, prevent awkward highlighting?

Question

I\'m building a drag and drop method, using query -onmousedown leading to -onmousemove (drag) then -onmouseup (unbinds onmousemove)

the problem is, browser defaults begi

Answer 1

add css

-webkit-touch-callout: none;/*for mobile*/
-webkit-user-select: none;/*for chrome*/
-khtml-user-select: none;/*for safari*/
-moz-user-select: none;/*for Mozilla*/
-ms-user-select: none;/*for mircosoft*/
-o-user-select: none;/*for opera*/
user-select: none;/*base css ,but not work in all browsers*/

Answer 2

You could disable highlighting using css

-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;

another way of doing this is to clear selection on drop event, as so:

function clearSelection() {
    var sel;
    if(document.selection && document.selection.empty){
        document.selection.empty() ;
    } else if(window.getSelection) {
        sel = window.getSelection();
        if(sel && sel.removeAllRanges)
        sel.collapse();
    }
}

So you would call clearSelection() on drop event (after the drag is finished)