remove selection using javascript (jquery)

Question

I'm working on a image viewer that has a draggable scrollbar. When the user drags the scrollbar, some of the text on the webpage becomes selected. I've tried

window.getSelection().removeAllRanges();

but that doesn't seem to work in IE7/8. Also tried the

document.getSelection().removeAllRanges();

which seems to work just as "well" with IE7/8.

Are there any other ways of doing this? Don't know of any jQuery solutions, but if there are, let me know (:

EDIT: This is the context of the onmouse-event

$("#slideBar").mousedown(function(f) {
 mouseDown = true;
    some more code...
}

$(document).mouseup(function() {
 if (mouseDown) {
    window.getSelection().removeAllRanges();
       more code...
    }
}

Answer 1

You could add some CSS (with jquery) to deal with this:

element {
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

Anyway, for IE, you need to add a proprietary attribute (with jquery) on that element:

unselectable="on"

Answer 2

Try returning false on the functions you use, especially for the "mousedown" event. Also returning false on document.onselectstart and document.ondragstart would help.