Show text letter by letter

前端 未结 16 1530
旧巷少年郎
旧巷少年郎 2020-11-27 16:38

What is the most elegant way of showing an html text letter by letter (like videogame captions) using CSS and JavaScript?

While I\'m sure that his can be solved usin

16条回答
  •  佛祖请我去吃肉
    2020-11-27 17:18

    Vanillla

    (function () {
    
    var showText = function(target, msg, index, interval){
    
      var el = document.getElementById(target);
    
      if(index < msg.length){
        el.innerHTML = el.innerHTML + msg.charAt(index);
        index = index + 1;
        setTimeout(function(){
          showText(target,msg,index,interval);
        },interval);
      }
    
    };
    
    
    showText("id", "Hello, World!", 0, 50);   
    
    })();
    

    you could improve on this code by changing it so you only get the el one time due to the fact that it takes a bit of resources to modify the DOM.

提交回复
热议问题