shile
/
raphael
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add section documenting which attributes can be animated. 

Signed-off-by: Dmitry Baranovskiy <dmitry.baranovskiy@gmail.com>
This commit is contained in:
Meitar Moscovitz 2009-01-29 00:25:15 +08:00 committed by Dmitry Baranovskiy
parent 1254ae193f
commit c064e970ea
2 changed files with 51 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
README.markdown
View File

@ -171,10 +171,35 @@ Linearly changes an attribute from its current value to its specified value in t
##### Parameters
1. newAttrs object A parameters object of the animation results.
1. newAttrs object A parameters object of the animation results. (Not all attributes can be animated.)
2. ms number The duration of the animation, given in milliseconds.
3. callback function \[optional\]
##### Attributes that can be animated
The `newAttrs` parameter accepts an object whose properties are the attributes to animate. However, not all attributes listed in the `attr` method reference can be animated. The following is a list of those properties that can be animated:
* cx number
* cy number
* fill colour
* fill-opacity number
* font-size number
* height number
* opacity number
* path pathString
* r number
* rotation number
* rx number
* ry number
* scale CSV
* stroke colour
* stroke-opacity number
* stroke-width number
* translation CSV
* width number
* x number
* y number
##### Usage
var c = paper.circle(10, 10, 10);

26
reference.html
View File

@ -170,10 +170,34 @@ c.attr({fill: "#000", stroke: "#f00", opacity: 0.5}); // using params object</co
</p>
<h4>Parameters</h4>
<ol>
<li>newAttrs <em>object</em> A parameters object of the animation results.</li>
<li>newAttrs <em>object</em> A parameters object of the animation results. (Not all attributes can be animated.)</li>
<li>ms <em>number</em> The duration of the animation, given in milliseconds.</li>
<li>callback <em>function</em> [optional]</li>
</ol>
<h4>Attributes that can be animated</h4>
<p>The <code>newAttrs</code> parameter accepts an object whose properties are the attributes to animate. However, not all attributes listed in the <code>attr</code> method reference can be animated. The following is a list of those properties that can be animated:</p>
<ul>
<li>cx <em>number</em></li>
<li>cy <em>number</em></li>
<li>fill <em>colour</em></li>
<li>fill-opacity <em>number</em></li>
<li>font-size <em>number</em></li>
<li>height <em>number</em></li>
<li>opacity <em>number</em></li>
<li>path <em>pathString</em></li>
<li>r <em>number</em></li>
<li>rotation <em>number</em></li>
<li>rx <em>number</em></li>
<li>ry <em>number</em></li>
<li>scale <em>CSV</em></li>
<li>stroke <em>colour</em></li>
<li>stroke-opacity <em>number</em></li>
<li>stroke-width <em>number</em></li>
<li>translation <em>CSV</em></li>
<li>width <em>number</em></li>
<li>x <em>number</em></li>
<li>y <em>number</em></li>
</ul>
<h4>Usage</h4>
<pre class="javascript code"><code>var c = paper.circle(10, 10, 10);</code>
<code>c.animate({cx: 20, r: 20}, 2000);</code></pre>