Skip to content

Effects: Clarify that callbacks are per-element #804

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Effects: Clarify that callbacks are per-element
Fixes #803
  • Loading branch information
dmethvin committed Sep 9, 2015
commit aa3bbac259211a8e7cb222b1171c9d5a16a15317
4 changes: 2 additions & 2 deletions entries/animate.xml
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,8 @@
</div>
<h4 id="duration">Duration</h4>
<p>Durations are given in milliseconds; higher values indicate slower animations, not faster ones. The default duration is <code>400</code> milliseconds. The strings <code>'fast'</code> and <code>'slow'</code> can be supplied to indicate durations of <code>200</code> and <code>600</code> milliseconds, respectively.</p>
<h4 id="complete">Complete Function</h4>
<p>If supplied, the <code>complete</code> callback function is fired once the animation is complete. This can be useful for stringing different animations together in sequence. The callback is not sent any arguments, but <code>this</code> is set to the DOM element being animated. If multiple elements are animated, the callback is executed once per matched element, not once for the animation as a whole.</p>
<h4 id="callbacks">Callback Functions</h4>
<p>If supplied, the <code>start</code>, <code>step</code>, <code>progress</code>, <code>complete</code>, <code>done</code>, <code>fail</code>, and <code>always</code> callbacks are called on a <em>per-element</em> basis; <code>this</code> is set to the DOM element being animated. If no elements are in the set, no callbacks are called. If multiple elements are animated, the callback is executed once per matched element, not once for the animation as a whole. Use the <code>.promise()</code> method to obtain a promise to which you can attach callbacks that fire once for an animated set of any size, including zero elements.</p>
<h4 id="basic-usage">Basic Usage</h4>
<p>To animate any element, such as a simple image:</p>
<pre><code>
Expand Down
2 changes: 1 addition & 1 deletion includes/complete-argument.xml
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<?xml version="1.0"?>
<argument name="complete" type="Function" optional="true">
<desc>A function to call once the animation is complete.</desc>
<desc>A function to call once the animation is complete, called once per matched element.</desc>
</argument>
10 changes: 5 additions & 5 deletions includes/options-argument.xml
Original file line number Diff line number Diff line change
Expand Up @@ -41,17 +41,17 @@
</argument>
</property>
<property name="complete" type="Function">
<desc>A function to call once the animation is complete.</desc>
<desc>A function that is called once the animation on an element is complete.</desc>
<!-- no parameters -->
</property>
<property name="start" type="Function" added="1.8">
<desc>A function to call when the animation begins.</desc>
<desc>A function to call when the animation on an element begins.</desc>
<argument name="animation" type="Promise">
<desc>An enhanced Promise object with additional properties for the animation</desc>
</argument>
</property>
<property name="done" type="Function" added="1.8">
<desc>A function to be called when the animation completes (its Promise object is resolved).</desc>
<desc>A function to be called when the animation on an element completes (its Promise object is resolved).</desc>
<argument name="animation" type="Promise">
<desc>An enhanced Promise object with additional properties for the animation</desc>
</argument>
Expand All @@ -60,7 +60,7 @@
</argument>
</property>
<property name="fail" type="Function" added="1.8">
<desc>A function to be called when the animation fails to complete (its Promise object is rejected).</desc>
<desc>A function to be called when the animation on an element fails to complete (its Promise object is rejected).</desc>
<argument name="animation" type="Promise">
<desc>An enhanced Promise object with additional properties for the animation</desc>
</argument>
Expand All @@ -69,7 +69,7 @@
</argument>
</property>
<property name="always" type="Function" added="1.8">
<desc>A function to be called when the animation completes or stops without completing (its Promise object is either resolved or rejected).</desc>
<desc>A function to be called when the animation on an element completes or stops without completing (its Promise object is either resolved or rejected).</desc>
<argument name="animation" type="Promise">
<desc>An enhanced Promise object with additional properties for the animation</desc>
</argument>
Expand Down