页面文字闪烁输入效果

最近最弄html5，不经意间发现挺好玩的，记录一下

html代码：

<div id="code">
<p>
<font color="#FF0000">
<span class="say">你说我啰嗦，</span><br>
<span class="say"> 有些东西因为越在乎所以越怕失去</span><br>
<span class="say"> </span><br>
<span class="say">因为我太爱你了，所以我害怕失去你</span><br>
<span class="say"> </span><br>
<span class="say">因为我太爱你了，所以我对你总啰嗦</span><br>
<span class="say"> </span><br>
</font>
<br />
<br />
</p>
</div>

js方法：

<script>
(function () {
var typewriter = function (id) {
var $ele = document.getElementById(id);
var str = $ele.innerHTML, progress = 0;
$ele.innerHTML = '';
var timer = setInterval(function () {
var current = str.substr(progress, 1);
if (current == '<') {
progress = str.indexOf('>', progress) + 1;
} else {
progress++;
}
$ele.innerHTML = str.substring(0, progress) + (progress & 1 ? '_' : '');
if (progress >= str.length) {
clearInterval(timer);
}
}, 75);
return this;
}

</script>

调用：

typewriter('code')