Cara Membuat Animasi Typing Text Menggunakan Javascript

Cara Membuat Animasi Typing Text Menggunakan Javascript - Dalam postingan kali ini saya akan mebahas tentang Cara Membuat Animasi Typing Text Menggunakan Javascript, ngomong-ngomong tentang animasi pastinya gambar atau tulisan yang bergerak.

Animasi auto typing text menggunakan javascript ini bisa sobat letakkan di sidebar blog sobat ataupun di postingan, mau tau bagaimana caranya ? Yuk ikuti ikuti caranya dengan mencopy dan pastekan kode script di bawah ini dan letakkan sesuai dengan keinginan sobat masing-masing.

<form name="news">
<textarea cols="50" name="news2" rows="3" wrap="virtual"></textarea>
</form>
<script type="text/javascript">
//<![CDATA[
var newsText = new Array();
newsText[0] = "Hello Sobat Rievers!";
newsText[1] = "Terima Kasih Anda Telah Membaca Artikel Tentang:";
newsText[2] = "Cara Membuat Animasi Auto Typing Text";
newsText[3] = "Semoga Bermanfaat Bagi Sobat Semua...";
newsText[4] = "Dan Selamat Mencoba!";
newsText[5] = "Jangan Lupa Tinggalkan Komentar Sobat...";
var ttloop = 1; // diulang-ulang teksnya ganti dengan 1 (1 = True; 0 = False)
var tspeed = 100; // 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>

Dari kode script di atas akan menghasilkan seperti ini ::

Demikianlah artikel tentang cara membuat animasi typing text menggunakan javascript. Jika ada kesalahan dalam bentuk apapun yang terdapat dalam artikel ini maupun artikel yang lainnya, saya mohon maaf yang sebesar-besarnya. Terima kasih

Share on Facebook

Share on Twitter

Share on Google+

Share on LinkedIn

Subscribe to receive free email updates: