如何使用javascript类型的效果向前和向后一个无限setInterval

Question

字体效果就是一个一个往前我要用也一个一个往后句子, 请查看我的代码片段并查看我想在我的代码片段中应用效果的控制台。

    let txt = 'I am from Bangladesh';
    let countForward = 0;
    let countBackward = txt.length;
    const setUpdate =   setInterval(function(){
        if(countForward >= txt.length){
            countBackward--;
            if(countBackward <=0){
                countBackward = 0;
            } else{
                let slice = txt.slice(txt.length, countBackward);
                
            }
        } else {
            countForward++;
        }

        let slice = txt.slice(0,countForward);
        console.log(countBackward)
       

        demo.innerHTML = slice;
        let sliceback = txt.length;
        
    },100)

 <div id="demo">

还需要无限的 setInterval，我试过但不明白我该怎么做。

Answer 1

不要使用两个单独的计数器，而是使用一个计数器和一个指示方向的布尔标志。

查看解决方案：

const txt = 'I am from Bangladesh';
let countingUp = true;
let count = 0;
const setUpdate = setInterval(function() {
  if (count > txt.length) {
    countingUp = false;
    count -= 2;
  } else if (count < 0) {
    countingUp = true;
    count += 2;
  }

  demo.innerHTML = txt.slice(0, count);
  count += countingUp ? 1 : -1;
}, 100)

<div id="demo">

如何使用javascript类型的效果向前和向后一个无限setInterval

How to use javascript type effect forward and backward one by one with infinite setInterval

javascript

effect