TYPEWRITER TEXT EFFECT
by kalai[ Edit ] 2008-04-30 18:58:07
We can create a sequences of characters letter by letter, simulating a typewriter by using setTimeout() function and setting the delay.
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
<!--
var text="content of text here";
var delay=50;
var currentChar=1;
var destination="[not defined]";
function type()
{
if (document.getElementById)
{
var dest=document.getElementById(destination);
if (dest)
{
dest.innerHTML=text.substr(0, currentChar);
currentChar++
if (currentChar>text.length)
{
currentChar=1;
setTimeout("type()", 5000);
}
else
{
setTimeout("type()", delay);
}
}
}
}
function startTyping(textParam, delayParam, destinationParam)
{
text=textParam;
delay=delayParam;
currentChar=1;
destination=destinationParam;
type();
}
//-->
</SCRIPT>
<title>JavaScript Typing Effect</title>
</head>
<body>
<DIV ID="textDestination">...</DIV>
</body>
<SCRIPT LANGUAGE="JavaScrip"t>
<!--
startTyping(text, 50, "textDestination");
//-->
</html>