TypeIt.js:空容器afterComplete每个字符串
TypeIt.js:空容器afterComplete每个字符串
提问于 2018-10-25 18:10:06
你好，我开始使用TypeIt.js，但在字符串之间的转换方面遇到了问题。
我基本上想：
- 类型第一字符串
- 暂停几秒钟
- 空，而不使用默认向后删除。
- 键入下一个字符串
我更新了上一篇文章，因为我意识到这个版本有问题。下面的代码几乎可以工作，但只有在第二个字符串完成后才能工作。
如何在每个字符串之后运行空函数？我试图在第一个字符串之后不进行向后删除。
https://codepen.io/NewbCake/pen/pxqVWO
谢谢你的帮助。
JS
new TypeIt('#element', {
strings: ['First string', 'Second string'],
breakLines: false,
speed: 100,
cursor: false,
loop: true,
afterString: function(step, queue, instance) {
instance.pause(1000).empty();
},
})Stack Overflow用户
发布于 2020-02-10 16:45:47
您可以使用可链接实例方法来完成此操作，但是它们必须在初始化之前附加到主TypeIt实例。看起来会是这样的：
new TypeIt('#element', {
breakLines: false,
speed: 100,
cursor: false,
loop: true
})
.type("First string.")
.pause(1000)
.empty()
.type("Second string.")
.pause(1000)
.empty()
.go();工作示例：https://codepen.io/alexmacarthur/pen/MWwwJVO
您也可以使用afterString回调来完成这个任务，这个回调在v6.5.0中是异步的，但是代码有点奇怪。
new TypeIt('#element', {
strings: ["First string.", "Second string."],
breakLines: false,
speed: 100,
cursor: false,
loop: true,
afterString: async (step, queue, instance) => {
await new Promise((resolve) => {
setTimeout(() => {
instance.instances[0].$e.innerHTML = "";
return resolve();
}, 1000);
});
}
}).go();希望这对一些人有帮助！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52995595
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号