Loading...
Blog-post Thumbnail

Simple Auto Write Text With Javascript

Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusamus aliquid sint provident rem distinctio quasi ipsa dicta aliquam modi, ipsam odio quod placeat dolores. Doloribus odit totam obcaecati eos adipisci. Lorem ipsum dolor sit amet consectetur adipisicing elit. Id enim reprehenderit ipsa rerum in, distinctio nihil similique obcaecati quae quo quos mollitia saepe iusto repudiandae nesciunt sit expedita odit sint! Lorem ipsum, dolor sit amet consectetur adipisicing elit. Facilis, corrupti sed sunt assumenda fugiat officia libero repellat debitis eos quam minus, delectus commodi laudantium neque harum sit impedit nemo autem?

This is file  CSS  :

* {
  box-sizing: border-box;
}
body {
  background-color: rebeccapurple;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
  margin: 0;
  min-height: 100vh;
}

This is file  Javascript  :

<script type="text/javascript">
  const text =
  "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita quae, ullam fuga asperiores hic 
  illo harum eaque optio vel eos dolorem quia delectus inventore, veritatis necessitatibus culpa ab. 
  Saepe, possimus.";
  let index = 0;
  function writeText() {
      document.body.innerText = text.slice(0, index);
      index++;
      if (index > text.lenght) {
        index = 0;
      }
    }
  setInterval(writeText, 100);
</script>

This is  preview  :

See the Pen Simple Auto Write Text With Javascript by Adnan Soebronto Leo (@adnan-soebronto-leo) on CodePen.


" The languages only differ in their grammar, their pronunciation and their most common words. Everyone realizes why a new common language would be desirable: one could refuse to pay expensive translators. "

- Thomas Anderson

Get in touch

For business inquiry please send email to : adnansubronto@gmail.com