JSFiddle - React, Tailwind, and code Playground
by techsin
HTML
<p class="fire"></p>
CSS
* { margin: 0; padding: 0;}
html, body { height: 100%; overflow: hidden;}
.fire {
position: absolute;
top: 25%;
left: 50%;
transform: translateX(-50%);
height: 300px;
line-height: 300px;
}
JavaScript
var arr = ["ด็็็็็้้้้้็็็็้้้้้็็็็็้้้้้็็็็็้้้้้็็็็็้้้้้", "ด็็็็็้้้้้็็็็้้้้้็", "ด็็็็็้้้"];
var f = $('.fire');
setInterval(function(){
f.text(nFire(1000));
},200);
function rand() {
return Math.floor(arr.length * Math.random().toFixed(3));
}
function nFire(n) {
var st = '';
while(n--) st += arr[rand()];
return st;
}