alternate()
Toggles the playback direction while adjusting the currentTime
position to reflect the new time progress.
Only the iterationTime
is actually played in reverse since the currentTime
always starts at 0
and ends at duration
.
Returns
The timer itself
Can be chained with other timer methods.
alternate() code example
import { createTimer, utils } from 'animejs';
const [ $alternateButton ] = utils.$('.button');
const [ $iterationTime ] = utils.$('.iteration-time');
const timer = createTimer({
duration: 10000,
loop: true,
onUpdate: self => {
$iterationTime.innerHTML = self.iterationCurrentTime;
}
});
const alternateTimer = () => timer.alternate();
$alternateButton.addEventListener('click', alternateTimer);
<div class="large centered row">
<div class="half col">
<pre class="large log row">
<span class="label">iteration time</span>
<span class="iteration-time value lcd">0</span>
</pre>
</div>
</div>
<div class="medium row">
<fieldset class="controls">
<button class="button">Alternate</button>
</fieldset>
</div>