<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<div class="show">
  <div class="text">Chào mừng bạn đến vơi Cáo Đêm, chúc bạn một ngày tốt lành :)</div>
</div>

<style>
.text{
font-size:30px;
color:#ff4444;
font-weight:bold
}
</style>

<script>
function autoType(elementClass, typingSpeed){
  var thhis = $(elementClass);
  thhis.css({
    "position": "relative",
    "display": "inline-block"
  });
  thhis.prepend('<div class="cursor" style="right: initial; left:0;"></div>');
  thhis = thhis.find(".text");
  var text = thhis.text().trim().split('');
  var amntOfChars = text.length;
  var newString = "";
  thhis.text("|");
  setTimeout(function(){
    thhis.css("opacity",1);
    thhis.prev().removeAttr("style");
    thhis.text("");
    for(var i = 0; i < amntOfChars; i++){
      (function(i,char){
        setTimeout(function() {        
          newString += char;
          thhis.text(newString);
        },i*typingSpeed);
      })(i+1,text[i]);
    }
  },1500);
}
$(document).ready(function(){ 
  autoType(".show", 90);
});
</script>

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<div class="show">
  <div class="text">Chào mừng bạn đến vơi Cáo Đêm, chúc bạn một ngày tốt lành :)</div>
</div>

<style>
.text{
font-size:30px;
color:#ff4444;
font-weight:bold
}
</style>

<script>
function autoType(elementClass, typingSpeed){
  var thhis = $(elementClass);
  thhis.css({
    "position": "relative",
    "display": "inline-block"
  });
  thhis.prepend('<div class="cursor" style="right: initial; left:0;"></div>');
  thhis = thhis.find(".text");
  var text = thhis.text().trim().split('');
  var amntOfChars = text.length;
  var newString = "";
  thhis.text("|");
  setTimeout(function(){
    thhis.css("opacity",1);
    thhis.prev().removeAttr("style");
    thhis.text("");
    for(var i = 0; i < amntOfChars; i++){
      (function(i,char){
        setTimeout(function() {        
          newString += char;
          thhis.text(newString);
        },i*typingSpeed);
      })(i+1,text[i]);
    }
  },1500);
}
$(document).ready(function(){ 
  autoType(".show", 90);
});
</script>

Mã nhúng & chia sẻ

jQuery tạo hiệu ứng chữ tự động nhảy ra như đang nhập liệu