使用javascript使用间隔更改多个属性?

时间:2012-06-21 06:19:14

标签: javascript jquery glow

我正在努力实现与jQuery Glowthis fiddle类似的功能。

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

我可以通过jQuery Glow看到这个功能不应该太难,但将它拼凑在一起并不能证明这是直观的。 js看起来非常适合悬停和链接,没有在载荷上定义不同的值并在预定的时间结束。

我怎么能这样做?感谢。

2 个答案:

答案 0 :(得分:0)

尝试Fading Effects并将其与setTimeout一起使用。你需要进行一些实验,我认为它会起作用:)

答案 1 :(得分:0)

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

由Paul Irish查看HTML5Rocks中的setAnimationFrame。阅读它here

  

黄油每秒平滑60帧。

Scroll this page,以及......

  

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

最后,

  

获取完整的内容:requestAnimationFrame API:现在用   sub-millisecond precision

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

但是,JSWorld还有更多内容,而不仅仅是jQuery。

对于初学者,请查看CreativeJS.com

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

ExtJS只是企业实力UI,动画互动。

目前,Raphael只是最先进的SVG。

值得一提的其他图形解决方案包括:D3.js,HTML5 Canvas和CSS3 Transforms。

编辑:I thought Adobe Edge was cool。它是HTML动画生成中的一个全新的隐喻,具有关键帧界面......接受,评论家无法超越beta的非语义DIV。我想我们会在一些高级HTML动画生成器上听到该团队的更多信息...... Yup, they got some new stuff!

希望有所帮助。 祝一切顺利! 纳什