jQuery + CSS курсор курсора + Chrome = не работает

Question

Я решил сделать / протестировать кросс-браузер Cursors, пока на Firefox он работает отлично, а на Chrome - несколько ..

Теперь пользовательский курсор отображается, но когда вы щелкаете где-то, он не изменяется, он вызывает событие mousedown, но не меняет курсор. Я попробовал только mousedown (); и это изменило курсор. Я предполагаю, что событие mouseup вызывает эту проблему.

$("body").mousedown(function() {
    $("body").addClass("clicked");
    console.log("down");
});
$("body").mouseup(function() {
    $("body").removeClass("clicked");
    console.log("up");
});

CSS

    body {
        cursor: url("../img/cursor1.cur"), default;
    }
    .clicked {
        cursor: url("../img/cursor2.cur"), default;
    }

Answer 1

Попробуйте щелкнуть и переместить мышь.

Я думаю, что хром изменяет только курсор мыши.

РЕДАКТИРОВАТЬ: Это известная ошибка, см. Перевод курсора браузера из «ожидания» в «авто» без перемещения мыши

Answer 2

Проблема в том, что вы используете глобальный объект window.event, а не объект события jQuery.window.event работает только в некоторых браузерах и не является стандартом W3C.

jQuery нормализует объект события, поэтому он одинаков во всех браузерах.В обработчик события передается этот объект события jQuery в качестве параметра.Вы должны использовать это.

$(".class_name").mousedown(function (e) {

  switch (e.which) {
    case 1: //leftclick
        //...
        break;
    case 3: //rightclick
        //...
        break;
  }
});

Answer 3

Я только что попробовал следующее:

$('body').mousedown(function(){
  $(this).css('background-color', 'red');
});
$('body').mouseup(function(){
  $(this).css('background-color', 'green');
});

Результат был, как и ожидалось, нажмите вниз -> красный BG, нажмите вверх -> зеленый BG

НО: это произошло только тогда, когда я назначил css: html, body { height:100%; min-height:100%; } Без CSS события не работали бы так быстро, как следовало бы.

Небольшой совет: с помощью firebug (по крайней мере, Chrome Dev Tools) вы можете следить за событиями, используя следующие отрывки:

monitorEvents(  $$('body')[0] )

Надеюсь, это помогло