javascript - 当元素在视口中时启动打字机效果

Question

当文本元素在视口中可见时，我需要启动它的打字机效果。我尝试使用 getBoundClientRect 但我认为我遗漏了一些东西。它总是在文档准备好时开始，所以如果你不快速进入元素，你就看不到效果。我也尝试使用滚动事件侦听器，但效果随着滚动的移动而运行。

这是我正在使用的代码：

let i = 0;
let txt = 'Natural . Imperfecto . Extraordinario';
let speed = 150;

function sectionActive () {
  let section = document.getElementById('typewriter');
  const boxPlace = section.getBoundingClientRect();
  
  if (boxPlace.top = 200) {
    function typeWriter() {  
      if (i < txt.length) {
        section.innerHTML += txt.charAt(i);
        i++;
        setTimeout(typeWriter, speed);
      }
    }
    typeWriter();
  }
}

jQuery(document).ready(sectionActive);

谢谢！！！