text

The text to transition to. If not set, the original text content of the target is used.

Accepts

  • String
  • Function(target, index, targets) returning a String

Default

Original text content

text code example

import { animate, scrambleText } from 'animejs';

const [ $p ] = utils.$('p');
const [ $button ] = utils.$('button');

const texts = ['Transition between different text.', 'Hello World!', 'Anime.js 4.4 scrambleText()'];
let i = 0;

function play() {
  i = (i + 1) % texts.length;
  animate($p, {
    innerHTML: scrambleText({ text: texts[i] }),
  });
}

play();

$button.addEventListener('click', play);
<div class="large row centered">
  <p class="text-l text-mono">Transition between different text.</p>
</div>
<div class="medium row">
  <fieldset class="controls">
    <button>Change text</button>
  </fieldset>
</div>