自定义光标图像CSS

小编典典

css

我有许多heroshot图像，单击它们时会弹出模式弹出窗口。我试图使光标在图像上移动时变成放大镜。即使我magnify.cur的位置正确，以下CSS也似乎无法正常工作。

a.heroshot img {
  cursor:url(/img/magnify.cur), pointer;
}

有没有人做过类似的事情？我不介意一个JavaScript解决方案（如果存在）。

编辑：它可以在Safari中，但不能在Firefox中使用。

阅读 480

2020-05-16

共1个答案

小编典典

您的问题可能是光标URL在Mac的Firefox中不起作用。

通过使用-moz-zoom-in关键字，可以在Firefox上获得相同的效果。

cursor:url(/img/magnify.cur), -moz-zoom-in, auto;

这将显示magnify.cur，Mozilla特定的缩放光标或系统默认光标。使用浏览器支持的列表上的第一个光标。

您还可以查看不同浏览器支持的光标关键字列表。

2020-05-16