So I'm using Raphael JS to try and animate.
Here's what I've tried:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://raphaeljs.com/raphael.js"></script>
<script type="text/javascript">
$(window).load(function () {
var R = Raphael("holder", 640, 480);
var test = R.text(200, 200, "Test string");
test.animate({cx: 20, cy: 20}, 2000);
});
</script>
</head>
<body>
<div id="holder">
</div>
</body>
</html>
And my text just remains at 200,200. Any thoughts on why this won't work?
The animate function is only capable of certain attributes, and only able to animate attributes that belong to that particular object.
A text object does not have cx or cy attributes - so your example code will not animate.
You may only translate a text object as it only has x, y and text attributes.
http://raphaeljs.com/reference.html#text
If you are trying to translate the text, use the x and y attributes like this:
test.animate({x:20, y:20}, 2000);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With