5

我正在构建一个页面,该页面将为对象(图像/形状/div)设置动画并将它们漂浮在屏幕上。有时可能会有大量的对象浮动和交互。

一个要求是让数据与每个对象相关联,因为它们每个都有一个 id。因此,如果我单击一个对象,它可以获取该 ID,然后引用一个包含该对象数据的数组。

我的争论是,我应该使用 jQuery $.animate 函数还是使用 Raphael。我知道 SVG 会很好用,但我不确定是否可以给每个对象和 id,然后在点击时调出一个包含关联数据的 div。点击 SVG 元素可以引用 DOM 元素吗?SVG 处理动态文本的效果如何?我还担心动画需要多少处理能力。在这方面有更好的选择吗?

顺便说一句,我在这里不是在谈论 jQuery SVG,只是普通的 jQuery 和 DOM。

如果有人对此有任何见解或建议,将不胜感激!

4

2 回答 2

2

关于快速 jQuery 动画,您可能对此感兴趣:http ://code.zemanta.com/fry/ruleanimation/

于 2009-09-24T09:12:11.310 回答
0

是的。所有图形对象都作为 DOM 对象添加。

一个演示:http ://raphaeljs.com/github/impact.html

简单的演示代码,绘制一个圆圈,分配一个 id,并附加一个 onclick 事件:

var paper = Raphael(10, 50, 320, 200);
// Creates circle at x = 50, y = 40, with radius 10
var circle = paper.circle(50, 40, 10);
// Sets the fill attribute of the circle to red (#f00)
circle.attr("fill", "#f00");
// Sets the stroke attribute of the circle to white (#fff)
circle.attr("stroke", "#fff");
//assign circle id="lolcats"
circle.node.id="lolcats";
//onclick alert id
circle.node.onclick=function(){alert(this.id)};

如果您需要进行精美的矢量绘图和操作,Raphael 会很好。如果没有,你不妨只使用你所知道的。此外,您可以同时使用 jQuery 和 Raphael。
不过,从它的声音来看,jQuery 应该足以满足您的需求。

于 2009-09-19T02:56:53.830 回答