【问题标题】: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】:
  1. 在 CSS3 中使用 .gray 类将所有图像设置为灰度

@987654321@

  1. 使用 CSS3 为您的元素设置过渡动画
  2. 使用 .slice(0,3) jQuery 方法从您的
  3. 中选择前三个元素
  4. 用纯 jQuery 移除 .gray 类

@987654322@

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

【讨论】:

  • 谢谢!暂时使用隐藏和显示来工作,但这是完美的。
猜你喜欢
  • 2016-01-11
  • 2021-10-06
  • 2015-11-20
  • 1970-01-01
  • 1970-01-01
  • 2011-12-28
  • 1970-01-01
  • 2022-01-12
相关资源
最近更新 更多