jquery - 图像从灰度变为彩色

Question

我在一个 div 中放置了 5 张图像，这些图像是彩色的，但我希望它们都先进行灰度化，然后在页面加载后前 3 个逐渐淡入颜色。我尝试使用各种 jquery 脚本（如 jQuery 灰度、去饱和等）来实现这一点，但没有成功。有人可以帮我弄清楚吗？

脚本如下所示：

<div class="cupImg">
   <img src="img/cup.png" alt="" /><img src="img/cup.png" alt="" /><img src="img/cup.png" alt="" /><img src="img/cup.png" alt="" /><img src="img/cup.png" class="last" alt="" />
</div>

Answer 1

1. 在 CSS3 中使用 .gray 类将所有图像设置为灰度

https://stackoverflow.com/a/4028908/2630208

2. 使用 CSS3 为您的元素设置过渡动画
3. 使用 .slice(0,3) jQuery 方法从您的
4. 使用纯 jQuery 删除 .gray 类

http://jsfiddle.net/8Q39r/1/

顺便提一句。代码在基于 Presto 的 Opera 中不起作用。这是该浏览器的功能限制。