How to animation with JavaScript drawing letters in a html website. 03.08.23

```html
<html>
  <meta http-equiv="Content-Language" content="th" />
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <style type="text/css">
    #body {
    background-color: yellow;
    color: #fff;
    }
</style>
  <body id="body">
    <canvas width=630></canvas>

(function loop() {
  ctx.clearRect(x, 0, 60, 150);
  ctx.setLineDash([dashLen - dashOffset, dashOffset - speed]); // create a long dash mask
  dashOffset -= speed;                                         // reduce dash length
  ctx.strokeText(txt[i], x, 90);                               // stroke letter

if (dashOffset > 0) requestAnimationFrame(loop);             // animate
  else {
    ctx.fillText(txt[i], x, 90);                               // fill final letter
    dashOffset = dashLen;                                      // prep next char
    x += ctx.measureText(txt[i++]).width + ctx.lineWidth * Math.random();
    ctx.setTransform(1, 0, 0, 1, 0, 3 * Math.random());        // random y-delta
    ctx.rotate(Math.random() * 0.005);                         // random rotation
    if (i < txt.length) requestAnimationFrame(loop);
  }
	    })();
	    </script>
    
    </body>
  </html>

```

https://stackoverflow.com/questions/29911143/how-can-i-animate-the-drawing-of-text-on-a-web-page

Anonymous

How to animation with JavaScript drawing letters in a html website. 03.08.23

Information Epoch 1715455553