为CSS自定义游标使用外部图像

是否可以使用CSS自定义游标的外部图像url？ 以下示例不起作用：

HTML：

<div class="test">TEST</div> 

CSS：

 .test { background:gray; width:200px; height:200px; cursor:url('http://upload.wikimedia.org/wikipedia/commons/d/de/POL_apple.jpg'); } 

小提琴： http : //jsfiddle.net/wNKcU/4/

Answer 1

它不工作，因为你的形象太大了 – 图像尺寸有限制。 例如，在Firefox中，大小限制是128x128px。

另外，你也必须添加auto 。

这里的jsFiddle演示 – 注意这是一个实际的图像，而不是默认的光标。

 .test { background:gray; width:200px; height:200px; cursor:url(dhtmltutors/cursor-hand.gif), auto; } 

 <div class="test">TEST</div 

Answer 2

我会把这个作为一个评论，但我没有代表它。 Josh Crozier回答的是正确的，但对于IE .cur和.ani是唯一支持的格式。 所以你可能应该有一个后备，以防万一：

 .test { cursor:url("dhtmltutors/cursor-hand.gif"), url(foo.cur), auto; }