Хром баг?Курсор меняется при нажатии мыши + движение

Question

В Chrome (я использую версию 16.0.912.75 m на Win 7) я нахожу, что независимо от того, какой у меня установлен курсор, как только я удерживаю левую кнопку мыши и перемещаю курсор, тип курсора изменено на text (даже если на странице нет текста).

Это ошибка? Кто-нибудь знает, как обойти это, потому что мой инструмент перетаскивания выглядит немного глупо!

JSFiddle: http://jsfiddle.net/KJfbs/

Редактировать

Как ответил @davgothic ниже, добавление -webkit-user-select: none; решит проблему, когда текста нет. Однако, если мы поместим элемент абсолютно и поместим текст позади него, проблема не исчезнет.

JSFiddle: http://jsfiddle.net/KJfbs/2/

Answer 1

Попробуйте добавить -webkit-user-select: none; в CSS для этого элемента, чтобы предотвратить выделение текста.

Пример: http://jsfiddle.net/KJfbs/1/

Лично я бы тоже добавил эти ...

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

... для кросс-браузерной совместимости.

Answer 2

Я думаю, что с -webkit-user-select: нет;проблема не исчезнет, ​​если вы добавите что-нибудь еще на страницу.Например: http://jsfiddle.net/KJfbs/237/

В любом случае, я думаю, что jQuery protectDefault решает проблему в любом случае: http://jsfiddle.net/KJfbs/241/

protectDefault избегает поведения по умолчанию, которое изменяется на текст курсора.
Тогда яможет управлять и устанавливать любой курсор, который я хочу: $ (this) .css ("cursor", "wait");

JQUERY:

$(function(){
    $('#lime').mousedown(function(e) {
        e.preventDefault();
        $(this).css("cursor","wait"); 
    }).on('mouseup mouseleave', function() {
        $(this).css("cursor","default");
    }); 
});

HTML:

<div id="lime"></div>
<p>Lorem ipsum dolor sit amet</p>

CSS:

#lime {
    background-color: lime;
    height: 100px; width: 300px;
    cursor: wait;
    position: absolute;
    top: 0; left: 0;
}