jquery - 我有一个 89x89px 的重复背景方形图像，当鼠标悬停时我想将其更改为随机彩色图像

Question

我只希望当前图像改变颜色并在鼠标移出该特定图像后重置。

当鼠标移到重复的图像上时，这将产生一个漂亮的多色图案。

提前感谢您的帮助。小提琴会很棒！

Answer 1

像这样的东西：

CSS

.foo {
    background: url('image1.png') repeat top left;
}

.foo:hover {
    background: url('image2.png') repeat top left;
}

HTML

<div class="foo"></div>

Answer 2

唔。我会为此使用 webkit 过滤器（但这就是我，我喜欢 webkit 浏览器，并希望有一天所有的浏览器都会支持它）。

就像是：

img {
    -webkit-transition: all 5s ease;
    -moz-transition: all 5s ease;
    -o-transition: all 5s ease;
    -ms-transition: all 5s ease;
     transition: all 5s ease;
}

img:hover {
     -webkit-filter: hue-rotate(333deg);
}

但同样，这取决于您想要实现的目标。在这里，看看我写的关于图像和悬停效果的简短教程。也许它会产生一些想法，并且您可以在浏览器中使用这些示例，因为它们托管在 codepen 上。

http://fivera.net/simple-cool-live-examples-image-hover-css-effect/