typed.js: Cannot get it to work!

Description

Hey Guys, hoping someone can help me with this problem.

I feel ridiculous, but I can’t get the simple example from “Strings from static HTML (SEO Friendly)” section in the README to work.

Steps to Reproduce

My code is as follows:

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="js/typed.min.js"></script>

  <script>
    var typed = new Typed('.element', {
      stringsElement: '#typed-strings'
    });
  </script>
</head>

<body>
  <div id="typed-strings">
    <p>Typed.js is an <strong>Awesome</strong> library.</p>
    <p>It <em>types</em> out sentences.</p>
  </div>
  <span id="typed"></span>

</body>
</html>

Expected behavior: I’ve tried running this in both chrome and safari but to no avail.

Actual behavior: The text is just presented statically with no typewriter effect. I’m getting the error:

Uncaught TypeError: Cannot read property 'tagName' of null
    at t.value (typed.min.js:10)
    at new t (typed.min.js:10)
    at test.html:5

NB: typed.min.js is the latest version (2.0.2) downloaded directly from github.

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Comments: 20 (4 by maintainers)

Most upvoted comments

i think order is important. i had same problem. you should write span tag and then script, then it works!

<body>
    <script src="./typed.js"></script>
    <span id="typed"></span>
    <script>
        var options = {
            strings: ["First sentence", "Second sentence"],
            typeSpeed: 40,
            }
        var typed = new Typed("#typed", options);
    </script>
</body>

nevermind hahahha that did the trick actually !!! It appears to work when I put the js in the head not the body… which is odd because I was always under the impression that we needed to put all query and js at the end of the <body>

Go to this link (“https://cdn.bootcss.com/typed.js/1.1.4/typed.min.js”) and copy the whole copy the whole page and paste it to your typed.js file. I think it will solve your problem.