Cara Membuat Typing Text Efffect Menggunakan Javascript
Jurnalcode.com

Cara Membuat Typing Text Efffect Menggunakan Javascript


Jurnalcode : Kali ini saya akan memposting sebuah tutorial bagaimana Cara Membuat Type Text Efffect Menggunakan Javascript. sebenarnya pengcodea nya sangat Sederhana dan mudah karena kita hanya mengkondisikan sebuah script javascript untuk mengolah text untuk dijadikan  efek Typing Text . nah bagaimana cara membuat nya ? silahkan ikuti tutorial berikut :

Pertama Silahkan Kalian buat file html . dan isikan code berikut :

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Membuat Efek Typing Text Js</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>

    <div id="Tulisan">

    </div>

<script type="text/javascript">
  var i=0,Tulisan;
  Tulisan = "Saya Suka Javascript , Jurnalcode.com"

  function typing() {
    if(i<Tulisan.length){
      document.getElementById("Tulisan").innerHTML += Tulisan.charAt(i);
      i++;
      setTimeout(typing,80);
    }
  }
  typing();
</script>


  </body>
</html>

 

Untuk Kode diatas sedenarnya sudah Work .. Nah kita bisa menambahkan sentuhan CSS untuk mempercantik tampilan script kita .. untuk menambahkan css silahkan lihat code berikut :

body{
  margin: 0;
  padding: 0;
  background: black;
}

#Tulisan{
  color: white;
  font-size: 40px;
  text-align: center;
  margin-top: 300px;
  text-transform: uppercase;
  font-family: "Montserrat";
  font-weight: 700;
}

 

Oke Selesai .. silahkan coba dengan kreasimu sendiri . untuk demo nya kalian bisa melihatnya diatas . jika ada yang ingin ditanyakan silahkan komentar dibawah ya... salam koder

 

 

.

Ayo Komentar