Script Typewriter Atau Script Mengetik Sendiri

kalian Pernah melihat sebuah postingan tapi dengan efek mengetik sendiri (bagi yang belum tau itu adalah TypeWriter).
Sebernarnya banyak sih macam-macam script TypeWriter ini, tapi kali ini saya akan share salah satu saja yah.
berikut saya share Script Typewriter Atau Script Mengetik Sendiri. Akan tetapi sebelum Anda mencoba menerapkan pada salah satu postingan blog ada beberapa hal yang harus diperhatikan sebagai berikut berikut :
1. Ada beberapa kode HTML yang tidak dapat bekerja didalam typewriter ini seperti penggunaan smiley termasuk link termasuk link image, kode atau kecuali kode tag break(br) (kode untuk pemutus baris)
2. Alangkah baiknya jika kode ini Anda gunakan untuk menulis selain tutorial seperti postingan Informasi, sebab sedikit dalam menggunakan kode html.
3. Buatlah konsep postingan Anda terlebih dahulu di media lain seperti NOTEPAD atau di MS Words untuk meminimalisir kesalahan nantinya, setelah siap baru gabungkan konsep postingan dengan kode semprawut dibawah hehe
4. Ingat !!..........Setiap kali berpindah baris harus menggunakan tag break diakhir kalimat

Copy Script di bawah ini!

<br />
<style type="text/css">
 body{
  font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;
  margin-top:0px;
   background-repeat:no-repeat;
  padding-top:1px;
 }
    #myContent, #myContent blink{
        width:100%px;
        height:100%px;
        background:black;
        color: #00FF00;
        font-family:courier;
    }  
    blink{
        display:inline;
    }
    </style><br />
    <script type="text/javascript">
  var charIndex = -1;
    var stringLength = 0;
    var inputText;
    function writeContent(init){
     if(init){
      inputText = document.getElementById('contentToWrite').innerHTML;
     }
        if(charIndex==-1){
            charIndex = 0;
            stringLength = inputText.length;
        }
        var initString = document.getElementById('myContent').innerHTML;
  initString = initString.replace(/<SPAN.*$/gi,"");
     
        var theChar = inputText.charAt(charIndex);
        var nextFourChars = inputText.substr(charIndex,4);
        if(nextFourChars=='<br>' || nextFourChars=='<br>'){
         theChar  = '<br>';
         charIndex+=3;
        }
        initString = initString + theChar + "<span id='blink'>_</SPAN>";
        document.getElementById('myContent').innerHTML = initString;

        charIndex = charIndex/1 +1;
  if(charIndex%2==1){
             document.getElementById('blink').style.display='none';
        }else{
             document.getElementById('blink').style.display='inline';
        }
             
        if(charIndex<=stringLength){
            setTimeout('writeContent(false)',10);
        }else{
         blinkSpan();
        }
    }
        var currentStyle = 'inline';
    function blinkSpan(){
     if(currentStyle=='inline'){
      currentStyle='none';
     }else{
      currentStyle='inline';
     }
     document.getElementById('blink').style.display = currentStyle;
     setTimeout('blinkSpan()',500);
   
    }
    </script>
 
<div id="myContent">
</div>
<div id="contentToWrite" style="display:none">
TULISAN ANDA <br />
1. No Smoking, No Die <br />
2. No Women, No Cry <br />
3. No Watch, No Brook<br />
4. No Money, No Dong<br />
</div>
<script type="text/javascript">
writeContent(true);
</script><br /><br />

Catatan:

• Kamu bisa merubah kode yang berarna merah sesuai keinginan kalian.

Mudah kan?
Selamat mencoba.
Terimakasih telah membaca artikel Script Typewriter atau script mengetik sendiri dan terimakasih telah berkunjung.
Semoga berhasil.
Semoga bermanfaat.