javascript - 光标在 Firefox Mac 上消失并且不会重置

Question

我正在开发一个网页，我需要在特定区域(div)隐藏光标并在另一个区域显示自定义光标。 它在所有浏览器上都能完美运行，但只有在 Firefox Mac 上，光标会隐藏并且永远不会回来。我已经取出了导致此问题的代码段( JSFiddle Link )。

$( "#left" ).mousemove(function( event ) {
    leftDiv.style.cursor = "none";
    console.log("Left - " + leftDiv.style.cursor);
});

$( "#right" ).mousemove(function( event ) {
    rightDiv.style.cursor = "url('http://cur.cursors-4u.net/cursors/images11/cur1047.png'), auto";
    console.log("Right - " + rightDiv.style.cursor);
});

以下是复制它的方法 - 尝试在空白区域和文本区域之间连续移动光标，有时光标会完全消失，根本看不到。通过一些解决办法可以解决这个问题吗？我看到 Firefox 上报告了一个错误 here

Answer 1

如果我们使用一个后备为“auto”的 URL，而不是使用“none”属性来隐藏光标，那么它就可以工作。

$( "#left" ).mousemove(function( event ) {
leftDiv.style.cursor = "url('http://www.jholjhaal.com/wp-content/uploads/2013/05/HiddenCursor.cur'), auto";
console.log("Left - " + leftDiv.style.cursor);
});

$( "#right" ).mousemove(function( event ) {
rightDiv.style.cursor = "url('http://cur.cursors-4u.net/cursors/images11/cur1047.png'), auto";
console.log("Right - " + rightDiv.style.cursor);
});

这种方法的问题是，如果 url 中指定的资源不存在，则浏览器的默认光标将显示而不是隐藏。