<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<style type="text/css">
.wrap{width:300px;height:200px;margin:20px auto;padding:10px;background:#c9e2b3;}
.fick{
display: inline-block;
-webkit-animation:fic 0.5s linear infinite;
}
@-webkit-keyframes fic{
0%{opacity:0;}
50%{opacity:1}
100%{opacity:0;}
}
</style>
</head>
<body>
<div class="wrap" id="wrap">
<div class="fick" id="fick">_</div>
</div>
</body>
<script>
var tit="我是好人，你喜欢我吗？喜欢就来关注我吧，我在这里等你，哈哈哈哈。。。。。。";
var wrap=document.getElementById("wrap");
var fick=document.getElementById("fick");
var flag=0;
var timer=window.setInterval(function(){
if(flag>=tit.length){
clearInterval(timer);
return;
}
var span=document.createElement("span");
span.innerHTML=tit[flag];
flag++;
wrap.insertBefore(span,fick);
},150);
</script>
</html>
