将饱和度应用于CSS / HTML / JS </div>中<div>(仅图像的一部分)后面的图像

时间:2013-09-16 19:08:17

标签: javascript css3 ios7

我正在使用HTML / CSS / JS制作iOS 7风格的应用程序。我们正在使用许多棘手的技术,并希望能够为元素设置动画,因此我将它们全部应用于HTML / CSS / JS,而不仅仅是使用原始图像。

对于模糊,我使用的是非常好的结果的blur.js - 你可以只在<div>后面模糊,然后你可以围绕它设置div的动画,看起来非常好,因为只有div背后的图像得到模糊。

不幸的是,我们也在Photoshop中应用了饱和度过滤器,我正在尝试复制它。看起来网络上的所有内容都表明您必须直接将饱和度降低应用于图像(通过-webkit-filter: saturate(50%);之类的东西)。如果我直接对图像执行此操作,我无法为其背后的div设置动画,而背后的图像看起来很傻。

任何方式应用去饱和“层”?我正在考虑的一种蛮力方法是使用div的位置来确定图像在哪里饱和,但担心这会破坏性能。

0 个答案:

没有答案