跨浏览器隐藏鼠标光标

Question

我想通过在鼠标光标经过div时隐藏鼠标光标来增强深度效果，是否有一种方法适用于所有浏览器？

Answer 1

查找适用于浏览器的内容非常困难。

以下代码适用于Chrome，IE和Firefox。 IE喜欢.cur文件，Chrome喜欢嵌入式png，有些浏览器实际上尊重无：）

#div {
    cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjbQg61aAAAADUlEQVQYV2P4//8/IwAI/QL/+TZZdwAAAABJRU5ErkJggg=='),
    url(images/blank.cur),
    none !important;
}

Answer 2

看起来像：

/* css */
div {
    cursor: url(url/to/transparent.gif), auto;
}

应该做的伎俩或：

divEl.style.cursor = 'url(path/to/transparent.gif), auto'; // javascript

但是隐藏光标可能会让参观者烦恼不已。

附录：在示例中，我编写了.gif文件，但实际上您可能需要转换为.cur或.ani文件以获得更好的浏览器支持。

Answer 3

为什么不简单地缩小光标的大小，因为它越来越接近深场的中心？

Answer 4

您可以更改您使用的光标类型（指针，帮助，十字准线......），但要隐藏它...即使在现代浏览器中这是可能的，旧浏览器也不支持此功能。我也无法想象为什么你会隐藏光标。

编辑：在firefox中将cursor:none;添加到body元素时它会隐藏光标，直到我查看链接，这可能是一个开始。

Answer 5

使用完全透明的图片无济于事。 （它不会让你这样做:(）
您应该使用1x1 1％透明图片，加上cursor:none。