Typed.js 多于一行

Question

我正在使用 typed.js 插件来实现打字效果。 我有两行，第一行完成后，我想从第二行开始。 这是我尝试过的，问题是，当它切换到第二行时，您可以简要地看到
正在键入的标记。 我不要这个。 请告诉我我做错了什么。 我也尝试在 first 的回调中调用 typed 函数，但它没有用:(

下面是我的代码

<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="typed.js"></script>
    <title>Typed.js</title>

<style>
   .test {
       font-size: 30px;
   }

    </style>
</head>
<body>
    <span class="box1"></span>
    <span class="box2"></span>

<script>
  $(function(){

        $(".box1").typed({
            strings: ["First sentence.", "<p></p><span class='test'>Second sentence.</span>",""],
            typeSpeed: 0,
            showCursor: false,

        });
    });
    </script>
</body>
</html>

请告诉我我做错了什么

Answer 1

可能为时已晚，但我意识到您可以在要显示的字符串中添加一个\\n ，并使用white-space: pre;设置键入元素的样式white-space: pre; 瞧，它可以在不显示任何标签的情况下工作。

所以 Javascript 代码应该是这样的：

  $(function(){

        $(".box1").typed({
            strings: ["First sentence.", "\n<span class='test'>Second sentence.</span>",""],
            typeSpeed: 0,
            showCursor: false,

        });
    });

和 CSS 将是：

.box {
  white-space: pre;
}

它也仅适用于一个字符串。

Answer 2

您是否尝试添加 contentType 属性？

$(".box1").typed({
        strings: ["First sentence.", "<p></p><span class='test'>Second sentence.</span>",""],
        typeSpeed: 0,
        showCursor: false,
        contentType: 'html'
});

Typed.js 多于一行

问题描述

2 个解决方案

解决方案1
1 2020-08-04 23:47:24

解决方案2
0 2014-12-11 13:26:30

Typed.js 多于一行

问题描述

2 个解决方案

解决方案1 1 2020-08-04 23:47:24

解决方案2 0 2014-12-11 13:26:30

解决方案1
1 2020-08-04 23:47:24

解决方案2
0 2014-12-11 13:26:30