javascript实现文字逐渐显现

下面是文字逐渐显现的JS代码
<pre id="wenzi"></pre>
<div style="display:none" id="zhujian">文字逐渐显示的JS,javascript实现
</div>
<script language="javascript">
var index=0;
var word=document.getElementById("zhujian").innerHTML;
function type(){
document.getElementById("wenzi").innerText = word.substring(0,index++);
}
setInterval(type, 500);
</script>

当然还要更多的代码

<!DOCTYPE html>
2
3 <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
4 <head>
5 <meta charset="utf-8" />
6 <title>
7 js实现文字逐渐显示http://www.hiry.cn
8 </title>
9 <script type="text/javascript">
10 var paper = "js实现文字逐渐显示http://www.hiry.cn";
11 var count = 1;
12 function oneByOne()
13 {
14 var screen = paper.substr(0, count);
15 loopText.innerHTML = screen;
16 count++;
17 if (count > paper.length)
18 return;
19 setTimeout(oneByOne, 250);
20 }
21 onload = oneByOne;
22 </script>
23 <style type="text/css">
24 #test {
25 position:absolute;
26 right:15em;
27 top:1em;
28 width:1px;
29 color:#ff0000;
30 font-size:20px;
31 font-weight:bold;
32 }
33 </style>
34 </head>
35 <body>
36 <div id="test">
37 <p id="loopText"></p>
38 </div>
39 </body>
40 </html>

猜你喜欢

转载自www.cnblogs.com/blogst/p/10407455.html