我的JS打字机代码如下:
问题1:如何添加不删除的字符串?我想使用一组单词“ We are”作为不会删除的句子的开头.正常情况下,.typeStrings将在“ We are”旁边键入:示例www.cantercompanies.com
问题2:如何在固定的“我们是”和.typeStrings文本颜色之间更改字体颜色?
<script>
var app = document.getElementById('typewriter');
var typewriter = new Typewriter(app,{
loop: true,delay: 40,});
typewriter.typeString('transportation')
.pauseFor(550)
.deleteAll(1)
.pauseFor(900)
.typeString('auto dealers')
.pauseFor(550)
.deleteAll(1)
.pauseFor(900)
.typeString('realtors')
.pauseFor(550)
.deleteAll(1)
.pauseFor(900)
.start(0)
<script>
最佳答案
您可以将HTML元素直接添加到typeString()中.这意味着您可以将所有文本都用span换行并添加类名或直接在< span />内放置样式.
var app = document.getElementById('app');
var typewriter = new Typewriter(app,{
wrapperClassName: 'test',delay: 50,loop: true,});
typewriter
.typeString('<strong>We are: </strong>')
.pauseFor(550)
.typeString('<span style="color:green;">transportation</span>')
.pauseFor(550)
.deleteChars(14)
.pauseFor(900)
.typeString('<span style="color:blue;">auto dealers</span>')
.pauseFor(550)
.deleteChars(12)
.pauseFor(900)
.typeString('<span style="color:purple;">realtors</span>')
.pauseFor(550)
.deleteChars(8)
.pauseFor(900)
.start();
<script src="https://unpkg.com/typewriter-effect/dist/core.js"></script>
<div id="app"></div>
希望这可以帮助,