working "this is me"

by al nmeri

HTML

<div>
  <p id="firstPara">text</p>
</div> >

CSS

body {
  height: 1000px;
}

div {
  position: relative;
  top: 700px;
  padding-bottom: 400px;
}

div #firstPara {
  border: 1px solid;
}

JavaScript

var firstString = ["This ", "is ", " me."];
var firstPara = document.querySelector("#firstPara");

window.addEventListener("scroll", function() {
  var interval = setInterval(slideIn, 800);
});

function slideIn() {
  console.log('slide runs');
  var distanceSoFar = (document.body.scrollTop);
  if (distanceSoFar > "170") {
    for (var i = 0; i < firstString.length; i++) {
      var stringOut = firstString.shift();
      firstPara.innerHTML += stringOut;
      console.log("5");
    }
  }
};