Onmouseover 使用超链接答案

【问题标题】：Onmouseover using HyperlinksOnmouseover 使用超链接
【发布时间】：2011-06-09 14:09:28
【问题描述】：

我有一个超链接和两张图片（一张是链接的普通图片，另一张是它的鼠标悬停图片）

我不知道如何让超链接的图片在鼠标悬停时发生变化。我知道我可以用'a'标签来做到这一点，但这个标签不支持这个：'~/Site/Page.aspx'所以如果我想浏览文件夹，我需要使用'../../Site /Page.aspx' 不准确。

那么如何使用 asp:hyperlink 按钮更改图片？

【问题讨论】：

【解决方案1】：

不要。使用 css：

a {
  background-image: url(images/image1.jpg);
}
a:hover {
  background-image: url(images/image2.jpg);
}

当然，只为你的情况使用特定的选择器。

【讨论】：

【解决方案2】：

我还推荐 CSS 路由，但是为了确保图像加载没有延迟，您可以使用图像编辑器将两个图像合并到一个文件中，并使用“背景位置”来切换图像的可见部分。

【讨论】：

不是问题的答案，而是一个很好的补充。这种技术称为“css sprites”，不仅消除了延迟，而且还最大限度地减少了对服务器的请求数量，因为只发送一个请求而不是两个请求来接收图像。