0

I'm trying to build a personal website from scratch. While I was looking around for ideas, I found this particular template that I liked: http://phydeve.epizy.com/imozar/index-1.html I want to try building everything on my own to learn but there's one thing I can't figure out. How do I achieve the changing text under the header (under "Hi I'm Norman Doe"). I've tried multiple google searches with differing terms but I can't find an explanation.

I am fine learning any language/flavor I might need.

pasha
  • 406
  • 1
  • 4
  • 17
  • You'll be better off learning html css and JavaScript – Ibu May 03 '19 at 22:34
  • Have you ever read about css animations? See also this [SO article](https://stackoverflow.com/questions/42236440) – Christian May 03 '19 at 22:55
  • Try this https://stackoverflow.com/questions/7264974/show-text-letter-by-letter/55987426#55987426 – gms May 04 '19 at 22:51

1 Answers1

2

I believe that person is using a plugin called Typer.js Link: https://steven.codes/typerjs/

There are definitely a lot of ways to do it with JS, but if you want minimal coding, I'd use a plugin.

<!--Put your words in the DATA-WORDS-->

<h1 style="font-family:sans-serif;">
  we are <span
    class="typer"
    id="some-id"
    data-words="sample word,another sample,amaziing"
    data-colors="#ed426d,#6d67c6,#b74033"
    data-delay="50"
    data-loop="1">
  </span>
</h1>



<!--Insert at the bottom of your html file-->
<script async src="https://unpkg.com/typer-dot-js@0.1.0/typer.js"></script>

Here's a fiddle: https://jsfiddle.net/jemismagical/1ajz9etk/19/

jemismagical
  • 36
  • 1