图像从灰度变为彩色答案

【问题标题】：Images to turn from grayscale to color one by one图像从灰度变为彩色
【发布时间】：2013-07-28 23:32:38
【问题描述】：

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

脚本如下所示：

<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>

【问题讨论】：

显示你的 jquery 代码。
我目前没有任何插件，因为我尝试了一些插件，但这些插件无法解决我的特定问题。

标签： jquery image colors loader grayscale

【解决方案1】：

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

@987654321@

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

@987654322@

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

【讨论】：

谢谢！暂时使用隐藏和显示来工作，但这是完美的。