javascript-Typewriter.typeString(添加不会删除的字符串?)

前端之家收集整理的这篇文章主要介绍了javascript-Typewriter.typeString(添加不会删除的字符串?) 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我的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>

希望这可以帮助,

猜你在找的JavaScript相关文章