Javascript实现打字效果

伤感的学期末

今天是这学期的最后一天，考完了最后一门数学，明天我们就要各自为自己的暑假打算打算了，所以趁着大家还没走一起出去打了打篮球，玩了玩轮滑，很累但是很开心，最大的感触莫过于忧伤额，明年我或许不在学校了，或许见不到他们，明年大三名存实亡，挺失落的。晚上玩轮滑都还好，最大的糗事儿竟然是没保护好美女老乡，貌似摔得不轻额，希望她木有事儿吧，祈祷！！！

打字效果学习

经常看见一个蛮过瘾的Javascript打字效果，一直自己想写个玩玩，貌似总忘了，今天来玩哈，我写的是使用setTimeout来实现的，貌似大神都不是这么弄。

介绍介绍我的思路，给出一段需要打字的内容，然后使用substring函数每隔x毫秒就截取一次字符串，直至最后一次截获整个字符串停止。我这里使用的事setTimeout，其实我觉得吧这个东东就是一个循环，只是循环木有等待时间，也就是时间间隔，仅仅我个人看法，或许还木有理解透彻吧！

 <html>

 <head>

     <title></title>

     <script type="text/javascript">

         message = "上世纪60年代，根据柳残阳原著改编的粤语神怪武侠片《如来神掌》曾红极一时，由当时的巨星曹达华、于素秋扮演主角，整个系列曾先后拍摄5集，片中的“火云邪神”([柠檬]饰演)是主人公龙剑飞的师傅，也是绝技“如来神掌”的传人。后来，曾江、雪妮还续拍了《如来神掌再显神威》、《如来神掌劈魔平九派》，可见这套电影当时的热门程度。而到了1982年，邵氏还推出了新版《如来神掌》，万梓良在片中扮演的就是“火云邪神”。电视也曾两度拍摄《如来神掌》片集，第一套分别由于洋主演，後一套由张智霖主演。《如来神掌》《如来神掌》火云邪神的名字还被借用到漫画之中，黄玉郎从上世纪70年代开始连载的名著《龙虎门》中的大反派、日本罗刹教教主便叫“火云邪神”。1994年，《功夫》的武术指导袁和平还拍过一部《火云传奇》，林青霞扮演的角色也被称为“火云邪神”。可以说，火云邪神一词在香港武侠文化中占有不可忽视的地位。 "

         pos =      /*初始截字符的位置*/

         maxlength = message.length +

         function writemsg() {

             if (pos < maxlength) {

                 txt = message.substring(pos, )

                 document.forms[].vito.value = txt

                 document.forms[].vito.style.color = '#00F'     /*设置打出来的字体样式*/

                 timer = setTimeout("writemsg()", )    /*设置间隔50毫秒打一个字*/

                 pos++

             }

         }

     </script>

 </head>

 <body>

     <form action="">

     <textarea rows="" cols="" id="vito"></textarea><br />

     <input type="button" onclick="writemsg()" value="开始" />

     </form>

 </body>

 </html>

以上打字效果图如下图：

话说我真心不想用这个图的，我也想给博客园减负，木有办法，罪过

网上其他人的类似效果

 <html>

 <head>

     <title>Type Write</title>

     <style type="text/css">

         a

         {

             text-decoration: none;

         }

     </style>

 </head>

 <body>

     <div id="newsticker">

         <span id="tickertitle"></span><a id="typewriter" href="#"></a>

     </div>

 </body>

 </html>

 <script type="text/javascript">

     var current =

     var x =

     var speed =

     var speed2 =

     function initArray(n) {

         this.length = n;

         for (var i = ; i <= n; i++) {

             this[i] = ' '

         }

     }

     typ = new initArray();

     typ[] = "406:red:Texas last in US Gov State Governors Websites (June 2008)";

     typ[] = "409:red:The Insolvency Service last in UK Central Government (June 2008)";

     typ[] = "384:green:Federated States of Micronesia 1st in US Gov State and Territorial Government Websites (April 2008)";

     typ[] = "413:green:U.S. Immigration and Customs Enforcement highest climber in US Gov Federal Agencies  (up 188) - June 2008";

     typ[] = "371:green:Iowa 1st in US Gov State Governors Websites (April 2008)";

     typ[] = "373:green:Directgov Jobs and Skills 1st in UK Central Government (April 2008)";

     typ[] = "379:red:Birmingham last in UK Local Government (April 2008)";

     typ[] = "406:green:Utah highest climber in US Gov State Governors Websites (up 16) - June 2008";

     typ[] = "380:red:Kent Police greatest faller in Police Forces (down 31) - April 2008";

     function typewrite() {

         var m = typ[current];

         document.getElementById("typewriter").href = '/survey/report.html?rt=' + m.substring(, m.indexOf(':'));

         m = m.substring(m.indexOf(':') + );

         document.getElementById("typewriter").style.color = m.substring(, m.indexOf(':'));

         m = m.substring(m.indexOf(':') + );

         m = m.replace("&", "and");

         document.getElementById("typewriter").innerHTML = m.substring(, x++) + "_";

         if (x == m.length + ) {

             x =

             current++

             if (current > typ.length - ) {

                 current =

             }

             setTimeout("typewrite()", speed2)

         }

         else {

             setTimeout("typewrite()", speed)

         }

     }

     typewrite()

 </script>

这个是我下的，效果就不演示了，gif太大，园子空间伤不起。

夜深人静404

今天就写到这里吧，貌似写的不咋地，希望对你有用吧。夜深人静，Bigod还在Dota，哥睡不着额，怎麽办怎麽拌，明天白天注定又困，伤不起。。。。

巴特西

Javascript实现打字效果

伤感的学期末

打字效果学习

网上其他人的类似效果

夜深人静404

最新文章

热门文章

巴特西

Javascript实现打字效果

伤感的 学期末

打字效果学习

网上其他人的类似效果

夜深人静404

最新文章

热门文章

伤感的学期末