zoukankan      html  css  js  c++  java
  • JS实现打字机式字符输出效果

    <html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
    <title>JS打字机风格的字符输出特效</title> 
    <SCRIPT language="JavaScript"> 
    <!-- 
     var layers = document.layers, style = document.all, both = layers || style, idme=908601; 
     if (layers) { layerRef = 'document.layers'; styleRef = ''; } if (style) { layerRef = 'document.all'; styleRef = '.style'; } 
     function writeOnText(obj, str) { 
       if (layers) with (document[obj]) { document.open();  document.write(str); document.close(); } 
       if (style) eval(obj+'.innerHTML= str'); 
     } 
     //以下是输出的内容,自己修改即可。 
     var dispStr = new Array( 
     "<font color=red size=3>欢迎来到源码爱好者...</font><br><font color=green size=3>她为我们提供各类编程源码、素材、书籍教程、设计模板、网页特效代码以及常用软件下载。</font><br><font color=blue size=3>是一个有质量的学习型源码下载站。</font>" 
     ); 
     var overMe=0; 
     function txtTyper(str, idx, idObj, spObj, clr1, clr2, delay, plysnd) { 
       var tmp0 = tmp1 = '', skip = 0; 
         if (both && idx <= str.length) { 
      if (str.charAt(idx) == '<') { while (str.charAt(idx) != '>') idx++; idx++; } 
      if (str.charAt(idx) == '&' && str.charAt(idx+1) != ' ') { while (str.charAt(idx) != ';') idx++; idx++; } 
      tmp0 = str.slice(0,idx); 
      tmp1 = str.charAt(idx++); 
      if (overMe==0 && plysnd==1) { 
        if (navigator.plugins[0]) { 
          if (navigator.plugins["LiveAudio"][0].type=="audio/basic" && navigator.javaEnabled()) { 
       document.embeds[0].stop(); 
       setTimeout("document.embeds[0].play(false)",100); } 
        } else if (document.all) { 
       ding.Stop(); 
       setTimeout("ding.Run()",100); 
        } 
        overMe=1; 
      } else overMe=0; 
     
      writeOnText(idObj, "<span class="+spObj+"><font color='"+clr1+"'>"+tmp0+"</font><font color='"+clr2+"'>"+tmp1+"</font></span>"); 
      setTimeout("txtTyper('"+str+"', "+idx+", '"+idObj+"', '"+spObj+"', '"+clr1+"', '"+clr2+"', "+delay+" ,"+plysnd+")",delay); 
       } 
     } 
     
     function init() { 
      txtTyper(dispStr[0], 0, 'ttl0', 'ttl1', '#339933', '#99FF33', 50, 0); 
     } 
     // --> 
    </SCRIPT> 
    </head> 
    <body bgcolor="#fef4d9" onload="init()"> 
    <DIV class=ttl1 id=ttl0><SPAN class=ttl1></SPAN></DIV> 
    </body> 
    </html> 
    

      

  • 相关阅读:
    不注意的小问题
    Hibernate、Spring和Struts工作原理及使用理由
    正则表达式贪婪与非贪婪模式
    Springmvc构造RESTful详细讲解
    正则表达式贪婪与非贪婪模式1
    BOJ二叉排序树的后序遍历
    qsort()应用大全
    辗转相除法求最大公约数(C语言)
    九度题目1014:排名 (结构体多级排序)
    BOJ第三题:二叉树前序遍历
  • 原文地址:https://www.cnblogs.com/umgsai/p/3908182.html
Copyright © 2011-2022 走看看