是否更好地使用HTML5＆amp;画布或CSS3（背景图片）＆amp; jquery做幻灯片吗？

Question

我正在制作幻灯片，图片不会是静态的，它们会通过数组动态引入，最后看起来像这样：

我想知道的是，什么是CPU友好，CSS3＆amp; jQuery只是通过改变填充屏幕的div的CSS类来简化转换，或，Canvas每次都刷新它？

Answer 1

您不必使用HTML5，但没有什么能阻止您......事实上，这是一个关于HTML5的幻灯片（使用 HTML5 ）！< / p>

http://slides.html5rocks.com/

Answer 2

Webkit（Safari，Chrome等）内置了对基于CSS的过渡效果的支持，Mozilla也在努力添加它们。能够在可用的情况下使用浏览器提供的转换肯定会提升性能。

我不确定您的浏览器兼容性要求是什么，但请记住，IE的任何版本都不支持<canvas>。您可以使用JavaScript库为其提供伪支持，但我认为这会导致性能损失。

Answer 3

鉴于我们在IE不支持CANVAS时所处的悲惨状态，那么我会坚持使用jQuery版本。当然，除非您不介意排除IE - 但请记住，它仍然是迄今为止最受欢迎的浏览器。

我还说滑块不是CPU密集型的，我总是首先考虑可维护性和兼容性。

Answer 4

我想到了很多选择：

1. JS / CSS的过渡经过了充分的测试。快速实施。 CPU使用率不太可能成为问题。

2. 但是，如果您想体验canvas选项和支持基于Redmond的浏览，那么您可以通过浏览Raphaël跨浏览器来简化生活API。

3. Pure CSS transitions是最优雅（可论证）的方法。不幸的是，库比蒂诺以外的人一直懒得实施它们，因此它们的使用目前大多局限于impressive额外的眼睛糖果。

4. 复古方式：假装它是2001年，而these guys使你能够以几百美元的价格进行一些严重的CPU刻录。