c# - 如何在悬停时更改图像源？

Question

我正在尝试使用 asp.net 和 javascript 的组合在鼠标悬停时更改图像源，这是我正在使用的代码

<asp:ImageButton id="button" runat="server" Height="65px" ImageUrl="~/images/logo.png"   OnMouseOver="src='~/images/hover.png';" OnMouseOut="src='~/images/logo.png';">

它最初显示，但在悬停时它会变成这样。我已经确认目录中有一张名为 hover.png 的照片。

感谢您的帮助!如有必要，我不介意完全更改代码。

Answer 1

如果这是问题所在并且 src 现在是 /images/hover.png 并且您将获得该图像。然后这里有一个技巧可以找出发生这种情况的原因。

转到浏览器的控制台并查找“网络”选项卡以查看请求图像的方式以及服务器对该图像的响应是什么。如果是 404，请确保图片链接准确无误。

其次，您还可以试用 jQuery 事件处理程序。

$('img').hover(function () {
  $(this).attr('src', '/images/hover.png');
});

这将在悬停事件时更新图像的属性。这是我为了让你理解这个方法而编的一个 fiddle 。

http://jsfiddle.net/afzaal_ahmad_zeeshan/k4shj/