建站资源下载详情
为您免费提供多种建站资源下载,包括网站模板下载、前端插件下载和字体下载!您只需注册为会员即可任意下载!

JS以打印机方式显示文字插件typed.js

来源:易助科技网浏览量:24收藏

简介


typed.js是一个类型化库,效果是用打字机的方式显示一段话,可以自定义任何字符串、指定显示速度、指定是否循环等。


JS以打印机方式显示文字插件typed.js-演示图



使用


1.  引入 typed.js 文件


2.  HTML


<span id="typed" style="white-space: pre-wrap;line-height: 30px;"></span>


3.  调用


<script type="text/javascript">
  var options = {
    strings: [
      'First test.',
      'Second test, \nit will pause for three seconds. ^3000',
      "Second test, \nthe last sentence will go back to 'Second test,', \noh no, this is the third test. ^1000",
      "It's going to start repeating."
    ],
    typeSpeed: 50,   //打印速度
    startDelay: 300, //开始之前的延迟300毫秒
    loop: true,      //是否循环
  };
  
  var typed = new Typed('#typed', options);</script>



相关链接


效果演示及文档 :https://mattboldt.com/demos/typed-js/

Github 地址 :https://github.com/mattboldt/typed.js/