Membuat Effect Typing text

berikut ini adalah script typing text yang bisa kita gunakan, simpel dan sederhana

<form name="news">
<textarea name="news2" cols=44 rows=1 wrap=virtual></textarea>
</form>
<script language="javascript" type="text/javascript">
document.news.news2.style.background = '#000000';
document.news.news2.style.color = '#0f0';
var newsText = new Array();
newsText[0] = "....._";
newsText[1] = "Halo...._";
newsText[2] = "apa kabar...._";
newsText[3] = "Selamat datang di blog saya..._";
newsText[4] = "Jangan lupa komentarnya ya..._"
newsText[5] = "heheheheh";
newsText[6] = "dan Jangan lupa jadi follower saya juga ya.._";

var ttloop = 5;    // Repeat forever? (1 = True; 0 = False)
var tspeed = 50;   // Typing speed in milliseconds (larger number = slower)
var tdelay = 1000; // Time delay between newsTexts in milliseconds

// ------------- NO EDITING AFTER THIS LINE ------------- \\
var dwAText, cnews=0, eline=0, cchar=0, mxText;

function doNews() {
  mxText = newsText.length - 1;
  dwAText = newsText[cnews];
  setTimeout("addChar()",1000)
}
function addNews() {
  cnews += 1;
  if (cnews <= mxText) {
    dwAText = newsText[cnews];
    if (dwAText.length != 0) {
      document.news.news2.value = "";
      eline = 0;
      setTimeout("addChar()",tspeed)
    }
  }
}
function addChar() {
  if (eline!=1) {
    if (cchar != dwAText.length) {
      nmttxt = ""; for (var k=0; k<=cchar;k++) nmttxt += dwAText.charAt(k);
      document.news.news2.value = nmttxt;
      cchar += 1;
      if (cchar != dwAText.length) document.news.news2.value += "_";
    } else {
      cchar = 0;
      eline = 1;
    }
    if (mxText==cnews && eline!=0 && ttloop!=0) {
      cnews = 0; setTimeout("addNews()",tdelay);
    } else setTimeout("addChar()",tspeed);
  } else {
    setTimeout("addNews()",tdelay)
  }
}

doNews()
</script>

Note :
Script diatas yang saya kasi warna biru muda itu adalah ukuran text areanya
sementara yang warna kuning adalah warna backgroudnya
warna kuning warna font nya
dan terakhir warna meraha adalah text kamu
jika text kamu ingin menambah textnya
bisa saja, tetapi harus sesuai urutannyanya ya :)
newsText[6] = "tambah text";


DEMO dibawah ini

BUKU TAMU DISINI

Share on Google Plus

About Budi Setiawan

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.