软件学堂

网游分类软件分类

类似安装效果的textarea滚动

2012-10-22 来源:网络

【实例名称】

类似安装效果的textarea滚动

【实例描述】

现在使用Microsoft提供的Install工具,都是向导形式的安装,但一些比较底层的工具安装,通常会使用类似DOS中的BAT批处理效果。本例学习如何通过textarea的滚动,实现这种效果。

【实例代码】

<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>标题页</title> </head> <body> <textarea id="install" cols=20 rows=10 style="background-color:Black; color:White;"></textarea> <script> var tmpStr = ""; for(var i = 0;i< 26;i++) {  for(var j=0;j<=i;j++)           //遍历26个英文字母  {   tmpStr += String.fromCharCode(65+i);//连接要显示的字符串  }  tmpStr += "......\r\n";          //行结束符号 } var arr = tmpStr.split("\r\n");   //将字符串切割成数组 function addLine(line)                                    {  if(line >= arr.length)   return;  var txtOb = document.getElementById("install");  //获取TextArea控件  txtOb.value += arr[line] + "\r\n";             //每局输出后都要求换行  if(txtOb.clientHeight <= txtOb.scrollHeight)   txtOb.scrollTop = txtOb.scrollHeight - txtOb.clientHeight;  setTimeout("addLine(" + (line+1) + ")",500); } setTimeout("addLine(0)",1); </script></body>

</body> </html>

【运行效果】

运行效果

【难点剖析】

本洌的重点有两个:循环输出26个英文字母,以及逐行输出的设计原理。输出26个英文字母。是通过字符串对象的“fromCharCode”方法,其中“65”是大写字母“A”的unlcode编码。逐行输出使用的是换行符“\r\n”。

【源码下载】

本实例JS代码下载

 

上一篇:使用marquee实现文字上下滚动
下一篇:始终显示在最顶端的文本

相关文章