title:(打字机效果源码)
cover:(https://img2020.cnblogs.com/blog/1957096/202005/1957096-20200527110106198-1974765350.jpg)
link:(https://github.com/Himmeltala/web-learning/tree/main/03.examples/%E6%89%93%E5%AD%97%E6%9C%BA)
| 参数名称 |
描述 |
默认值 |
| texts |
打印文本数组，依次打印，一段文字结束之后将从头开始 |
- |
| typingSpeed |
打印速度，从文本开始到结束打印的速度 |
100 |
| eraseSpeed |
回退速度，从文本结束到开始回退的速度 |
20 |
| eraseDelay |
打印一段文字之后，停留多久开始回退 |
2000 |
| blinkSpace |
光标距离文本末尾处的距离 |
5 |
<!DOCTYPE html>
<html lang="en">
<head>
<title>打字机效果</title>
</head>
<body>
<div id="typewriter" class="typewriter"></div>
<script>
// ... 源码详见 Github 仓库
const texts = [
"你好，很高兴认识你，接下来将自我介绍，",
"我是一个 Web <Developer />，",
"技术栈：Vue.js、React.js，",
"喜欢日漫、游戏，",
"座右铭：Time tick away, dream faded away!",
];
const typewriter = new Typewriter({ texts });
typewriter.type();
</script>
</body>
</html>
