<html>
<head>
<style type="text/css">
#myTypingText {
width:700px;
height:120px;
padding:12px;
color:#333;
font-family: Helvetica, sans-serif;
font-size:100px;
line-height:1.5em;
}
#myTypingText::before {
border-left: 2px solid blue;
}
</style>
</head>
<body>
<div id="myTypingText"></div>
<script type="text/javascript" language="javascript">
var myString = "Hack Spots";
var myArray = myString.split("");
var loopTimer;
function frameLooper() {
if(myArray.length > 0) {
document.getElementById("myTypingText").innerHTML += myArray.shift();
} else {
clearTimeout(loopTimer);
}
loopTimer = setTimeout('frameLooper()',100);
}
frameLooper();
</script>
</body>
</html>