text selection AND bubbling

Question

this is the problem: I'm using javascript and JQuery (not UI) to drag nested objects in my web page. to disable the text selecting I have to return FALSE from the mousedown handler, but this disable also the event bubbling. But I need event bubbling... What can I do?? thanks

Answer 1

A partial solution for disabling text selection is css user-select:

user-select: none;
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;

Although, I don't think it works in IE.

Another thought might be (if your layout allows) to overlay your text with an invisible div. This should prevent text selection.

<div class='textbox'>text box<div class='overlay'></div></div>

        .textbox {
            width:100px;
            height: 100px;
            position: relative;
        }

        .overlay {      
            width: 100%;
            height: 100%;
            opacity: 0;
            position:absolute;
            top:0;left:0;
        }