加载页面时如何使用自定义图像为鼠标光标设置动画？答案

【问题标题】：How to animate mouse cursor with custom image when loading page?加载页面时如何使用自定义图像为鼠标光标设置动画？
【发布时间】：2013-07-18 06:15:37
【问题描述】：

我正在尝试使用自定义图像更改我网站上的光标。

这是我的实际 CSS：

<style type="text/css">
<!--
body {
cursor:url(images/default.cur),auto; 
}
a:hover {
cursor: url(images/hover.cur),auto;
}
a:active {
cursor: url(images/wait.ani),auto;
}
-->
</style>

Firefox 3.5.6 确实使用我的 .cur 文件更改了默认光标，但问题是 .ani 光标不适用于 Firefox（甚至 .gif）。它确实适用于 IE。

我使用的光标文件可以在here找到。

另一个问题是我只是在更改 a:active 图像来为我的光标设置动画，但它很快就消失了。

当我们点击转到某个页面时，我想改变光标，一旦加载该页面，光标就会变为“正常”。

我正在寻找一种在有人点击我网站的某些内部链接时更改光标的方法。

我不必更改所有链接来执行此操作，但它似乎不起作用。

我想过一些 window.onload JavaScript，但我没有实现编写它，可能有更好的方法。

感谢您的 CSS 或 JavaScript 建议。

【问题讨论】：

他们在 1995 年尝试过。没有人喜欢它。

标签： css firefox animation cursor onload

【解决方案1】：

当被要求提供编程解决方案时，请不要提供设计反馈。回传设计评论不是开发人员的职责。这可能不是他的决定，可能行不通，但他想尝试，我们应该提供帮助。如果您所处的环境是程序员对每个设计决策都做出批判性判断，您会意识到这对整个团队来说是非常具有破坏性的。如果你不评论你是否同意他们想要做的事情，除非被问到，设计师和团队成员会更看重你。我希望如果你仔细想想，你会明白为什么它很重要。

【讨论】：

请不要以纯粹的批评作为答案，因为它没有回答问题，因此对于将来查看此帖子的任何人来说都是完全没用的，应该作为评论给出。
您说的完全正确，尽管我不确定您是否知道您指的是九年前的评论。我应该将它作为评论发布，并且当时可能对 Stack Overflow 没有什么经验。

【解决方案2】：

不要。如果你去你朋友的我的空间页面，你的光标突然变成了一条紫色的大龙，你不知道它到底指向哪里，你会怎么想。

这对用户来说很刺耳，因此很恼火。如果您想让他们知道某些东西在后台运行，请使用在页面上显示的动画 gif，，而不是光标。

如果您也有，您可以在页面上的所有元素上使用 javascript 设置它。我不认为它是级联的。如果是这样，只需将其设置在 body 上即可。

【讨论】：

我同意。完全没有必要更改光标，并且不遵循任何常见的 Web 标准。
我理解您的意见，但我不会将其更改为一些奇怪的图像，例如您的龙示例。另外，如果我不将其更改为自定义图像，而是将其更改为光标：等待图像，例如此处w3schools.com/CSS/tryit.asp?filename=trycss_cursor（或w3schools.com/CSS/pr_class_cursor.asp）的示例，我该如何加载？
请上帝不要劫持我的光标
@jason，上帝与此无关。

【解决方案3】：

如果使用 ASP，使用解析 url 会简化一些事情......即

    cursor:url('\<\%\=ResolveUrl("~/img/magnify.cur")\%\>');

显然，我倾向于同意其他说法，因为熟悉度是任何优秀设计的关键，将环境定制到用户感到不熟悉或认为他们的系统以某种方式被改变的程度，是一个糟糕的糟糕设计，并且对设计师的影响也很差。我并不是说设计要枯燥，而是要保留一点。

我可能不太喜欢 MetroUI（而是 Metro Web Design），但我喜欢它的根源，即“包豪斯”的设计理念。

"There is beauty in simplicity."

【讨论】：