Search code examples
javascriptanimationdomtypedtyped.js

Uncaught TypeError: $(...).typed is not a function

I m using this library https://github.com/mattboldt/typed.js/ .I have added all the script files at the end of body code but still i m getting an error in console. My code is:

  <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>LUNA-NG</title>

        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="apple-touch-icon" href="apple-touch-icon.png">
         <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,400,700,900' rel='stylesheet" type="text/css">
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link href="https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900" rel="stylesheet">
        <link rel="stylesheet" href="css/bootstrap-theme.min.css">
        <link rel="stylesheet" href="css/fontAwesome.css">
        <link rel="stylesheet" href="css/tooplate-style.css">
        <link rel="stylesheet" href="node_modules/typed.js/assets/demos.css">
    </head>

 <body>
<span class="typed"></span>
 <script src="js/vendor/jquery-1.11.2.min.js"></script>

        <script src="js/vendor/bootstrap.min.js"></script>

        <script src="js/plugins.js"></script>
        <script src="js/main.js"></script>
        <script src="node_modules/animejs/anime.min.js"></script>

        <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
        <script>
            (function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
            function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
            e=o.createElement(i);r=o.getElementsByTagName(i)[0];
            e.src='//www.google-analytics.com/analytics.js';
            r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
            ga('create','UA-XXXXX-X','auto');ga('send','pageview');
        </script>

  <script type="text/javascript" src="jquery.interactive_3d.js"></script>

  <script src="node_modules/typed.js/lib/typed.js"></script>
    <script>
      $(function() {
  $(".typed").typed({
    strings: ["Typed.js is a jQuery plugin that types.", "Enter in any string,", "and watch it type at the speed you've set,", "backspace what it's typed,", "and begin a new sentence for however many strings you've set."],
    typeSpeed: 0
  });
});
        </script>

Console:

Uncaught TypeError: $(...).typed is not a function
    at HTMLDocument.<anonymous> ((index):259)
    at j (jquery-1.11.2.min.js:2)
    at Object.fireWith [as resolveWith] (jquery-1.11.2.min.js:2)
    at Function.ready (jquery-1.11.2.min.js:2)
    at HTMLDocument.J (jquery-1.11.2.min.js:2)

Any help in this regard is greatly appreciated. Thanks in advance.

Solution

  • I m using the cdn for typed.js library. This is working fine now. I was giving the right path even though i was getting error so i decid to move to cdn. Below is the script i have included.Thanks for your answers

    <script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/1.1.1/typed.min.js"></script>