reset() JS

Pauses and resets currentTime, progress, reversed, began, completed properties to their default values.

animation.reset(softReset);

Parameters

Name	Type	Description
softReset=false ^(opt)	`Boolean`	If `true`, only reset the internal values without causing a visual render

Returns

The animation itself

Can be chained with other animation methods.

reset() code example

import { animate, utils, stagger } from 'animejs';

const [ $hardReset, $softReset ] = utils.$('.button');

const animation = animate('.square', {
  x: '17rem',
  alternate: true,
  ease: 'inOutSine',
  loop: true,
  delay: stagger(100),
});

const hardReset = () => animation.reset();
const softReset = () => animation.reset(true);

$hardReset.addEventListener('click', hardReset);
$softReset.addEventListener('click', softReset);

<div class="medium row">
  <div class="square"></div>
</div>
<div class="medium row">
  <div class="square"></div>
</div>
<div class="medium row">
  <fieldset class="controls">
    <button class="button">Hard reset</button>
    <button class="button">Soft reset</button>
  </fieldset>
</div>

Previous Next