打字机和设置持续时间

Question

我想在HTML/JavaScript/jQuery中有一个打字机效果，例如这个，但我需要指定动画的持续时间。例如，如果我设置 10 秒并且字符串是"狗"，则动画将非常慢。这可能吗？谢谢。

Answer 1

我将使用与本文相同的函数。

这真的很简单。

在线typeString($tar, settings.text[idx], 0, settings.delay, function () {和在线deleteString($tar, settings.delay, function () {更改settings.delay (settings.delay / settings.text[idx].length)然后在调用构造函数时传递延迟（以毫秒为单位）选项以及所需的时间。 例如：

    $('#target').teletype({
      delay: 10000,
      text: [
        'dog',
        'Lorem ipsum dolor sit amet, consetetur sadipscing elitr,',
        'sed diam nonumy eirmod tempor invidunt ut labore et dolore',
        'magna aliquyam erat, sed diam voluptua. At vero eos et',
        'accusam et justo duo dolores et ea rebum. Stet clita kasd',
        'gubergren, no sea takimata sanctus est Lorem ipsum dolor         sit',
        'amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr,',
        'sed diam nonumy eirmod tempor invidunt ut labore et dolore',
        'magna aliquyam erat, sed diam voluptua. At vero eos et         accusam',
        'et justo duo dolores et ea rebum. Stet clita kasd gubergren,',
        'no sea takimata sanctus est Lorem ipsum dolor sit amet.'
      ]
    });`

Answer 2

您可以修改该现有插件以添加一个接受 totalDelay 参数的新函数，然后将现有的 typeString 函数与 delay = totalDelay / str.length 一起使用。