html - 悬停不同链接时的图像变化

Question

我发现了这一点：将鼠标悬停在文本链接上以更改图像，它解释了如何使用 jQuery 执行此操作。

没有jQuery或javascript有什么办法吗？

这可以只用 html/css 来完成吗？

Answer 1

使用 CSS：

.myClass {
background-image:url(image1.jpg);
}

.myClass:hover {
background-image:url(image2.jpg);
} 

Answer 2

即使你可以用 CSS 做到这一点，它也会非常混乱。为什么不改用 jQuery 或 Javascript？

在 jQuery 中，尝试使用.hover()鼠标事件。

你可能会从这样的事情开始（伪代码）：

$(".linkclass").hover(
  function () {
    $(.imageclass).css('background-image','image.jpg');
  },
  function () {
    $(.imageclass).css('background-image','image2.jpg');
  }
);