Tengo texto animado en JavaScript y CSS pero el problema es que el texto se repite constantemente. Cómo puedo dejar de repetir después se muestra una vez y permanece visible.

El código Javascript es:

 <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/2.0.2/anime.min.js"></script> <script> // Wrap every letter in a span var textWrapper = document.querySelector('.slogan'); textWrapper.innerHTML = textWrapper.textContent.replace(/\S/g, "<span class='letter'>$&</span>"); anime.timeline({loop: true}) .add({ targets: '.slogan .letter', opacity: [0,1], easing: "easeInOutQuad", duration: 2250, delay: (el, i) => 150 * (i+1) }).add({ targets: '.slogan', opacity: 0, duration: 1000, easing: "easeOutExpo", delay: 1000 }); </script>

El resultado final que necesito es un eslogan posterior al espectáculo que permanezca así hasta que los clientes actualicen la página y dejen de repetirlo después de 1 vez.

Gracias a todos