hexo打字机

琅琊王朝 · 发表于 2023-9-27 21:34:00

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

https://loujunyi-blog.netlify.app/
我希望在https://langyawangchao.github.io/实现自动打字，并且自定义内容
主题已经弄好了

isdkz · 发表于 2023-9-27 21:34:18

要在 Hexo 博客中实现自动打字效果，你可以使用一个名为 Typed.js 的 JavaScript 库。你可以通过以下步骤来实现：

1. 在你的 Hexo 博客中安装 Typed.js 库：

npm install typed.js --save

复制代码

2. 在你的主题中添加 Typed.js 的 CSS 和 JavaScript 文件。你可以将它们下载到你的本地，然后将它们放在你的主题目录下的  /source/css  和  /source/js  文件夹中。然后在你的主题中添加以下代码：

<link rel="stylesheet" href="/css/typed.css">

<script src="/js/typed.js"></script>

复制代码

3. 在你的 Hexo 博客中创建一个新的页面，用于显示自动打字效果。你可以在你的 Hexo 博客根目录下运行以下命令来创建一个新页面：

hexo new page typing

复制代码

这将在你的 Hexo 博客中创建一个名为  typing  的新页面。

4. 在你的  typing  页面中添加以下代码：

<div id="typed-strings">

  <p>你想要打字的第一行内容</p>

  <p>你想要打字的第二行内容</p>

  <p>你想要打字的第三行内容</p>

</div>

<div id="typed"></div>

<script>

  var typed = new Typed('#typed', {

stringsElement: '#typed-strings',

typeSpeed: 50,

backSpeed: 50,

loop: true

  });

</script>

复制代码

在上面的代码中，你需要将  #typed-strings  元素中的内容替换为你想要打字的内容。你还可以根据需要调整  typeSpeed  和  backSpeed  的值来改变打字的速度。

5. 最后，在你的 Hexo 博客中添加一个链接，以便用户可以访问你的自动打字页面。你可以在你的主题中添加以下代码：

<a href="/typing">自动打字</a>

复制代码

这将在你的 Hexo 博客中添加一个名为“自动打字”的链接，当用户点击该链接时，他们将被带到你的自动打字页面。

希望这可以帮助你实现你想要的效果！

Mike_python小 · 发表于 2023-9-27 22:29:15

实现自动打字效果并自定义内容

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

html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Typewriter Effect</title>
</head>
<body>
<h1 id="typewriter"></h1>
<script>
// 自定义打字内容
const text = "这是我自定义的打字内容。";
// 获取要显示打字效果的元素
const typewriter = document.getElementById("typewriter");
// 定义打字速度和初始索引
const speed = 100; // 每个字符的打字时间间隔（毫秒）
let index = 0; // 当前打字到的位置
// 定义函数实现打字效果
function type() {
if (index < text.length) {
typewriter.innerHTML += text.charAt(index);
index++;
setTimeout(type, speed); // 通过递归实现连续打字效果
}
}
// 调用打字函数
type();
</script>
</body>
</html>

复制代码

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

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

球一个最佳答案谢谢啦！这对我非常重要！

Mike_python小 · 发表于 2023-9-27 22:31:09

没B用，不如实在写几篇文章管用
到了还是用了hexo，那你去搜打字效果，我猜一抓一把，baidu和bilibili可以解决你的需求

账号		自动登录	找回密码
密码			立即注册

hexo打字机

马上注册，结交更多好友，享用更多功能^_^

浏览过的版块