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

尝试单击并移动鼠标。

我认为chrome只会在mousemove上改变光标。

编辑：这是一个已知错误，请参阅Getting the browser cursor from "wait" to "auto" without the user moving the mouse

Answer 2

我刚刚尝试了以下内容：

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

结果如预期，点击 - ＆gt;红色BG，点击 - ＆gt;绿色BG

但是：这只发生了，当我分配了css：html, body { height:100%; min-height:100%; } 没有CSS，事件并没有像他们应该的那样“流畅”。

小提示：使用firebug（至少是chrome dev工具），您可以使用以下剪切监视事件：

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

希望这有帮助

Answer 3

问题是您使用的是全局window.event对象，而不是jQuery的事件对象。 window.event只能在某些浏览器中使用，而且它不是W3C标准。

jQuery规范化事件对象，使其在所有浏览器中都相同。事件处理程序将jQuery事件对象作为参数传递。你应该使用它。

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

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

jQuery + CSS cursor mousedown + Chrome =无效

3 个答案: