javascript – CSS不透明度性能.图像褪色

我正试图淡出我的照片以换取照片库.所有这些都是在 JavaScript中完成的,它只是改变了图像元素的不透明度CSS值.这在某些计算机上实际上是滞后的(慢) – 例如我的笔记本电脑并不是非常强大,但它是全新的(华硕Eeepc).

我想知道无论如何我都能解决这个性能问题.我已经看到Canvas动画和HTML5应用于图像的演示,它们在我的笔记本电脑上非常流畅.我想知道我是否可以将相同的东西应用到我的图像淡入功能.

有任何想法吗？我该怎么做？

解决方法

我很快就按照要求使用canvas标签逐渐消失了一个图像示例： http://jsfiddle.net/6wmrd/12/(仅在Chrome和Firefox中测试过)

我不确定是否有任何性能提升,但这里至少是一个如何完成它的一个非常简单的例子.还应注意,这是在5分钟内完成的,因此可以改进和优化代码.

否则,根据我的经验,如果你在图像后面有一个坚实的背景,我发现有时使用与背景相同颜色的图像上的元素淡化是更平滑的.

提高性能的其他方法可能是降低FPS.如果我没弄错的话MooTools标配50 FPS.但是,降低FPS可能会影响感知性能.