使用javascript使用intervals更改多个属性？

Question

我正在尝试实现类似于jQuery Glow或this fiddle的东西。

具体地说，我考虑的是在加载时启动并持续10秒，其中javascript以100毫秒的间隔执行。假设发生的是背景颜色或元素A将使用渐变范围(开始#000和结束#fff)改变，而元素B的不透明度将改变(开始0和结束1)。因此，每100毫秒，不透明度将增加1 (0.01，0.02，...，1.0)并结束。所有元素A的背景将沿着从#000到#fff的梯度逐步递增。

我可以从jQuery Glow看出，这个功能应该不会太难，但是把它拼凑在一起并不能证明它是直观的。js看起来非常适合于悬停和链接，而不是定义不同的值onLoad并在预定的时间结束。

我怎么能这样做呢？谢谢。

Answer 1

setTimeout不再是JavaScript动画中的唯一选项。

看看保罗·爱尔兰写的“HTML5Rocks中的setAnimationFrame”。阅读关于它的here。

黄油流畅，每秒60帧。

Scroll this page和..。

避免导致回流-重绘循环的动画；更新您的rAF调用以期望高分辨率的时间戳作为第一个参数；

最后，

在requestAnimationFrame API: now with sub-millisecond precision上获得完整的概要。

另外，nnnnnn是正确的。jQuery的一个主要优势是效果。

但是，除了jQuery之外，JSWorld还有更多的东西。

对于初学者，请查看CreativeJS.com。

它是WebGL，但更重要的是: three.js (关注@mrdoob)。

ExtJS是简单的企业级用户界面，动画交互。

到目前为止，Raphael仅仅是最先进的SVG。

其他值得一提的图形解决方案有: D3.js、HTML5 Canvas和CSS3转换。

编辑：I thought Adobe Edge was cool。它是HTML动画生成中一个全新的比喻，带有一个关键帧接口……接受吧，批评者无法通过测试版的非语义DIV。我想我们会从这个团队听到更多关于一些高级HTML动画生成器的信息。Yup, they got some new stuff!

希望这能有所帮助。万事如意！纳什

Answer 2

尝试Fading Effects并与setTimeout一起使用。您必须尝试一下，我认为它会奏效的:)