如何使這個js動畫效果為多行&動畫一個接一個？就像<h1 class="rks1">  First Line </h1><h1 class="rks1">  Then Second Line </h1><h1 class="rks1">  Then Third Line </h1><h1 class="rks1">  Then Fourth Line </h1><h1 class="rks1">  Then Fifth Line </h1>&更多...然后重新啟動第一行，或者我認為它可能喜歡：<h1 class="rks1">  First Line </h1><h1 class="rks2">  Then Second Line </h1><h1 class="rks3">  Then Third Line </h1><h1 class="rks4">  Then Fourth Line </h1><h1 class="rks5">  Then Fifth Line </h1>&更多...然后重新啟動第一行var textWrapper = document.querySelector('.rks1');textWrapper.innerHTML = textWrapper.textContent.replace(/(\S*)/g, m => {  return `<span class="word">` +    m.replace(/(-|)?\S(-|@)?/g, "<span class='letter'>$&</span>") +    `</span>`;});var targets = Array.from(document.querySelectorAll('.rks1 .letter'));anime.timeline({  loop: true,})  .add({    targets: targets,    scale: [3,1],    scaleY: [1.5,1],    opacity: [0,1],    translateZ: 0,    easing: "easeOutExpo",    duration: 400,    delay: (el, i) => 60*i  }).add({    targets: targets.reverse(),    scale: [1,3],    scaleY: [1,1.5],    opacity: [1,0],    translateZ: 0,    easing: "easeOutExpo",    duration: 100,    delay: (el, i) => 30*i  }).add({    opacity: 0,    duration: 2000,    easing: "easeOutExpo",    delay: 800  });.rks1 {font-weight: 900;font-size: 2.5em;font-family: rr;}.rks1 .letter {display: inline-block;line-height: 1em;}.word {white-space: nowrap;}.span {}<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/2.0.2/anime.min.js"></script><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>   <h1 class="rks1"> First animate this line Okay </h1><h1 class="rks1">  Then Second Line </h1><h1 class="rks1">  Then Third Line </h1><h1 class="rks1">  Then Fourth Line </h1><h1 class="rks1">  Then Fifth Line </h1>or may be this format :& more...我想讓這成為首先動畫一行，然后在同一個地方動畫下一行，然后下一個，與依此類推相同。干草！堆棧溢出社區任何人在此功能中更改此javascript，請快速完成。這對我來說非常重要。