Geek Answers Handbook

Animation: jQuery or Raphael?

I create a page that will animate objects (image / shape / div) and float them around the screen. From time to time, there may be a large number of objects floating and interacting.

The requirement is to have data associated with each object, since each of them has an identifier. So, if I click on one object, it can capture this identifier, and then it refers to an array containing data about this object.

My debate is that if I have to use jQuery $ .animate function or use Raphael. I know that SVG would be nice to use, but I'm not sure if I can give each object an id and then call a div containing the associated onclick data. Can I click SVG elements referring to DOM elements? How well does SVG work with dynamic text? I am also concerned about how much processing energy the animation will take. Is there a better choice in this regard?

By the way, I'm not talking about jQuery SVG here, just normal jQuery and DOM.

If anyone has any idea about this or suggestions, they will be very grateful!

+5
source share
2 answers

. DOM.

: http://raphaeljs.com/github/impact.html

, , 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)};

, . , , . , jQuery, Raphael.
, , jQuery .

0

More articles:


All Articles