怎样让博客的标语更与众不同呢? 可以使用打字机效果,让标语一字一字打出来。这样看起来更有动感。

这里我们需要用到 typed.js

安装

npm install typed.js

yarn add typed.js

bower install typed.js

CDN

<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11"></script>

使用

<html>

  <head>
    <title>TypedJS Test</title>
    <script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11"></script>
  </head>

  <body>
    <span class="test"></span>
    <script>var options = {
        strings: ["天行健,君子以自强不息。"],
        typeSpeed: 40
      };

      var typed = new Typed(".test", options);
    </script>
  </body>

</html>

官方示例

可以参考这个网页的效果:http://mattboldt.github.io/typed.js/

最后修改:2021 年 03 月 16 日 08 : 58 PM
如果觉得我的文章对你有用,请随意赞赏