Cara Membuat Widget Pengetik Otomatis

Posted by Iqbal IDesainer

Brew, udah ngeliat widget baru blog saya belum? Itu looh yang ada sidebar kanan atas. Nih deh saya kasih liat dulu widgetnya kalo belum tau,

1
2
3
4
5
6
 Nah itu adalah salah satu contoh widget pengetik otomatis. Jadi jangan kaget kalo di blog saya ada widget seperti ini. Ini bukan setan yah yang ngetik tapi kita sendiri yang telah menentukan tulisan apa yang nanti akan otomatis akan diketikkan. Tapi emang siih contoh di atas agak mengandung bayi 9 bulan yang berbau horor. Tapi sekali lagi jangan takut! Fungsi widget ini macam-macam looh. Selain untuk menakut-nakuti pengunjung, widget ini berfungsi juga untuk menyapa ataupun memberitahukan hal penting kepada pengunjung. Cukup keren bukan? Oke langsung aja kita buat sekarang!

1. Login ke akun blogger Anda,
2. Pada dasbor, klik rancangan - Tambah Gadget - HTML/JavaScript
3. Kopi kode di bawah ini lalu pastekan di menu HTML/JavaScipt tadi,

<form name="news">
<textarea name="news2" cols="23" rows="3" wrap="virtual"></textarea>
</form>

<script type='text/javascript'>
//<![CDATA[

var newsText = new Array();
newsText[0] = "Teks ke-1";
newsText[1] = "Teks ke-2";
newsText[2] = "Teks ke-3";
newsText[3] = "Teks ke-4";
newsText[4] = "Teks ke-5";
newsText[5] = "Teks ke-6";

var ttloop = 1;    // diulang-ulang teksnya ganti dengan 1 (1 = True; 0 = False)
var tspeed = 250;   // 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>

4. Kemudian simpan dan lihat hasilnya.

Keterangan:
1. Ganti tulisan teks ke-1 sampai teks ke-5 yang berwarna biru dengan tulisan yang dikehendaki. Jika ingin menambah baris tulisan menjadi enam baris, maka tambahkan kode newsText[6] di bawah newsText[5].
2. Angka 1 berwarna merah menunjukkan tulisan yang kita ketikkan akan diulang-ulang kalau baris terakhir udah terlewati. Ubah angka 1 menjadi 0 kalau tulisan ga mau diulang-ulang.
3. Angka 250 berwarna oranye menunjukkan kecepatan mengetik. Semakin besar angkanya, semakin lambat kecepatan mengetiknya.
4. Angka 1000 berwarna ungu menunjukkan jarak waktu antar teks ke-n dan teks ke-n dalam satuan milisecond. (1000 milisecond= 1 detik)


http://arkan-indo.blogspot.com/

Poskan Komentar

Cari Artikel di Label Blog Ini

Anime (8) Anti Virus (30) Ayo Dance (12) Browser (25) Food (7) Games (56) Hacker (14) Knowledge (487) Media Player (18) Misteri (82) Ninja Saga (41) Other (127) Pendidikan (127) Point Blank (335) Serba 7 (59) Sofware (161) Tips (179) Tips Blog (44) Tips Komputer (26)