hexo中文字实现打字机效果

最新推荐文章于 2024-08-09 07:08:58 发布

Linda小东东

最新推荐文章于 2024-08-09 07:08:58 发布

阅读量1.9k

点赞数

分类专栏：个人博客前端文章标签： hexo typed.js 打字机效果

本文链接：https://blog.csdn.net/u013278374/article/details/103300633

版权

本文介绍了如何在hexo博客中实现打字机效果，利用typed.js插件，通过NPM、Yarn或Bower下载安装，并提供在页面中插入代码的步骤，以达到动态打字效果。同时提到可以通过修改光标为表情来增加视觉效果。

摘要由CSDN通过智能技术生成

文字的打字机效果是不是感觉蛮炫呢，其实是用typed.js这个插件实现的哦~

下载typed.js

With NPM

npm install typed.js
With Yarn

yarn add typed.js
With Bower

bower install typed.js

详细内容戳 👉 typed.js官网

typed.js的使用

使用非常简单，在相对应的页面中加入以下代码就完成啦。

<script src="<%- theme.libs.js.typed %>"></script> //引入js文件
<script>
var options = {
    strings: [' <%- config.description %>', ' <%- config.descriptionEN %>'],
    typeSpeed: 120, //打印的速度。数值越大，速度越慢
    loop: true, //开启循环
    loopCount: Infinity, //设置循环次数，值为：Infinity，也可以使用数值
    backSpeed: 20, //延迟时间后才后退，值越大，延迟的时间就越