2

我正在尝试实现类似于jQuery Glowthis 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 并在预定时间结束。

我怎么能这样做?谢谢。

4

2 回答 2

0

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

查看 Paul Irish 的 HTML5Rocks 中的 setAnimationFrame。在这里阅读。

黄油般流畅的每秒 60 帧。

滚动此页面,然后...

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

最后,

在以下位置获取完整的概要:requestAnimationFrame API:现在具有 亚毫秒精度

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

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

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

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

ExtJS是简单的企业级 UI,动画交互。

Raphael是目前最先进的 SVG 。

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

编辑:我认为 Adob​​e Edge 很酷。这是 HTML 动画生成中的全新隐喻,具有关键帧界面……接受,批评者无法超越 beta 版的非语义 DIV。我想我们会从那个团队那里听到更多关于一些高级 HTML 动画生成器的信息……是的,他们得到了一些新东西!

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

于 2012-06-22T03:26:44.030 回答
0

尝试褪色效果并将其与setTimeout. 您必须进行一些实验,我认为它会起作用:)

于 2012-06-21T06:26:30.710 回答