跨浏览器隐藏鼠标光标

时间:2010-09-08 20:14:55

标签: javascript html css

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

5 个答案:

答案 0 :(得分:4)

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

以下代码适用于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;
}

答案 1 :(得分:2)

看起来像:

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

应该做的伎俩或:

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

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

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

答案 2 :(得分:1)

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

答案 3 :(得分:0)

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

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

答案 4 :(得分:0)

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