Question

I decided to make/test Cursors cross-browser, so far on Firefox its working perfect, but on Chrome – somewhat..

Now, the custom cursor shows, but when you click somewhere, it doesn’t change, it does trigger mousedown event, but it doesn’t change the cursor. I tried just mousedown(); and it changed the cursor. I guess the the mouseup event is causing this trouble.

$("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

Try clicking and moving the mouse.

I think chrome only changes cursor on mousemove.

EDIT: This is a known bug, see Getting the browser cursor from "wait" to "auto" without the user moving the mouse