设为首页收藏本站
切换到窄版

鱼C论坛

 找回密码
 立即注册
鱼C论坛»论坛 › 编程语言专区 › Web开发 › hexo打字机
返回列表 发新帖
查看: 1788|回复: 3

hexo打字机

[复制链接]
Mike_python小
发表于 2023-9-27 22:29:15 | 显示全部楼层
实现自动打字效果并自定义内容

要在你的网页上实现自动打字效果，并且自定义打字内容，你可以使用JavaScript来实现。以下是一个实现自动打字效果的示例代码：

  1. html
  2. <!DOCTYPE html>
  3. <html lang="en">
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <title>Typewriter Effect</title>
  7. </head>
  8. <body>
  9.     <h1 id="typewriter"></h1>

  11.     <script>
  12.         // 自定义打字内容
  13.         const text = "这是我自定义的打字内容。";

  15.         // 获取要显示打字效果的元素
  16.         const typewriter = document.getElementById("typewriter");

  18.         // 定义打字速度和初始索引
  19.         const speed = 100; // 每个字符的打字时间间隔（毫秒）
  20.         let index = 0; // 当前打字到的位置

  22.         // 定义函数实现打字效果
  23.         function type() {
  24.             if (index < text.length) {
  25.                 typewriter.innerHTML += text.charAt(index);
  26.                 index++;
  27.                 setTimeout(type, speed); // 通过递归实现连续打字效果
  28.             }
  29.         }

  31.         // 调用打字函数
  32.         type();
  33.     </script>
  34. </body>
  35. </html>
复制代码


你可以将以上代码保存为一个HTML文件，然后在你的网页上引入该文件即可实现自动打字效果。注意替换自定义的打字内容。在示例代码中，我们已经将打字内容设置为"这是我自定义的打字内容。"。

希望以上信息能够帮助到你。如果还有其他问题，请随时提问。

球一个最佳答案谢谢啦！这对我非常重要！
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

Mike_python小
发表于 2023-9-27 22:31:09 | 显示全部楼层
没B用，不如实在写几篇文章管用
到了还是用了hexo，那你去搜打字效果，我猜一抓一把，baidu和bilibili可以解决你的需求
小甲鱼最新课程 -> https://ilovefishc.com
回复 支持 反对

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2025-10-8 02:59

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表