The typewriter text script comes in three parts. There is a small piece of HTML, a slightly larger piece of CSS, and of courese the JavaScript.
Let's start by looking at the HTML. As we are going to use an unobtrusive JavaScript, all we need are a script and link tag in the head of the page and a div in the body where the typewriter text is to appear. Here's the code to go in the head of your page:
HTML Code:
<html>
<head>
<script type="text/javascript">
var content = "Your typewriter text goes here";
function twDisplayTW() {twDisplay('tw',content,0);}
loaded('tw',twDisplayTW);
var brk = '~'; // character to use for line break
var resetTime = 0; // set to 0 to not reset or seconds to delay before reset
function twDisplay(id,content,num) {var delay = 140; if (num <= content.length) {var lt = content.substr(0,num); document.getElementById(id).innerHTML = lt.replace(RegExp(brk,'g'),'<br \/>'); num++; if (num > content.length) delay = resetTime * 1000;} else {document.getElementById(id).innerHTML = ''; num = 0;} if (delay > 0) setTimeout('twDisplay("'+id+'","'+content+'","'+num+'")',delay);} var pageLoaded = 0; window.onload = function() {pageLoaded = 1;}; function loaded(i,f) {if (document.getElementById && document.getElementById(i) != null) f(); else if (!pageLoaded) setTimeout('loaded(\''+i+'\','+f+')',100);}
</script>
</head>
<body>
<div id="tw"></div>
</body>
</html>
Typewriter Text
Linear Mode
