自己用来练习的，附上详细注释,如果有和我一样喜欢并想要学习Dom特效创作的朋友，推荐先系统了解Javascript中Html Dom Object部分的内容，包括常用方法及属性。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>文字段逐个变色循环特效</title>

</head>

<body>

    <a href="#" style="text-decoration:none">

    <script type="text/javascript">

       //判断是否为IE浏览器,这一步可以不要

        function isIe(){

            return ("ActiveXObject" in window);

       }

           //全局变量

        var words="请点我这里！";

        var  n=0;

        var flashing;

        var temp=[];

          document.write('<B><font size="12px" color="red">');    //输出html元素标签等内容

          //依次改变words的格式

          for(index=0;index<words.length;index++){  //将字符串拆分成字符单位处理

            document.write('<span  id="neonLight" style="font-family:Verdana,Arial;font-size:18px;">'+words.charAt(index)+' </span>');

         }

            document.write("</font></B>");   //输出html元素标签内容

            temp=document.getElementsByTagName("span");

      //逐渐变色

      function neon(){

               //起始为红色

            if(n==0){

                for(i=0;i<temp.length;i++){

                    temp[i].style.color="red";

                }

              }

               //依次变为蓝色

           if(n<temp.length){

                temp[n].style.color="blue";

                n++;

               }else{  //变完回到初始状态

                n=0;

             }

          } 

                //启动函数

       function beginNeon(){

           flashing=setInterval("neon()",1500 ); //每隔1.5秒启动

               }

       beginNeon();

           </script></a>

     </body>

</html>

这里在推荐一个介绍JS知识体系结构十分给力的站点，可以当平时的参考工具表  —http://dreamdesign.csrjgzs.com/Article/ShowArticle.asp?/4032-1.html

Js文字特效—文字段逐个变色循环的更多相关文章

  1. 7款震撼人心的HTML5CSS3文字特效

    1.HTML5像素文字爆炸重组动画特效 今天我们要分享一款基于HTML5技术的文字像素爆炸重组动画特效,我们可以在输入框中指定任意文字,点击确定按钮后,就会将原先的文字爆炸散去,新的文字以像素点的形式 ...

  2. 7款震撼人心的HTML5文字特效

    1.CSS3五彩文字特效 文字带阴影效果 这是一款非常具有卡通形象的CSS3五彩文字特效,虽然没有迷人的动画效果,但是五彩缤纷的文字展现在屏幕上也是非常酷的,再加上每一个文字都有不同角度的阴影效果,加 ...

  3. HTML5/CSS3(PrefixFree.js) 3D文字特效

    之前在园子里看到一个HTML5/CSS3的文字特效(这里),觉得挺好玩的所以小小的研究了下,不过发现代码都是针对webkit以及FF的所以IE跪了. Runjs 我将示例中的代码进行了精简,后来发现C ...

  4. 18款js和jquery文字特效代码分享

    18款js和jquery文字特效代码分享 jQCloud标签云插件_热门城市文字标签云代码 js 3d标签云特效关键词文字球状标签云代码 原生JS鼠标悬停文字球状放大显示效果代码 原生js文字动画圆形 ...

  5. JS文字特效：彩色滚动变幻效果，只适合少量的文字。（过多对页面有影响）

    JS代码如下: 代码具体是在哪里的我不知道但是我的有道云上有.如有哪位朋友知道,还望联系下,添加出处. <div id="chakhsu"></div> & ...

  6. HTML5火焰文字特效DEMO演示

    效果展示:http://hovertree.com/texiao/html5/26/ 效果图: 扫描二维码查看效果:

  7. HTML5火焰文字特效DEMO演示---转载

    只有google支持 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...

  8. CSS3火焰文字特效制作教程

    原文:CSS3火焰文字特效制作教程 用一句很俗气的话概括这两天的情况就是:“最近很忙”,虽然手头上有不少很酷的HTML5和CSS3资源,但确实没时间将它们的实现过程写成教程分享给大家.今天刚完成了一个 ...

  9. PS软件操作应用—文字特效

      前  言 JRedu 在图像调整和文字工具的分享文章中,对文字工具做了简单的介绍,包括了文字的字体.字号大小.颜色以及字间距行距等等的设置和修改,都是一些基本的功能,在这次的分享中我们介绍下文字特 ...

随机推荐

  1. Eclipse的详细安装步骤

    第一种:这个方法是在线安装的  第二种:下载完整免安装包 首先打开网址:http://www.eclipse.org/ 然后在这里我就选择64位的安装,就以安装安卓开发的举例: 然后下载即可:

  2. ios 时间和毫秒数转换

    01-时间和毫秒数的相互转换 //获取毫秒数的时间戳 long inter = [[NSDate date] timeIntervalSince1970]*1000; NSLog(@"%ld ...

  3. 函数调用关于从Ring3转到Ring0 ESP堆栈变化

    在ring0堆栈获取ring3堆栈方式 第一种方式 [esp+4] == [esp+参数个数*4+4] 如果这里不相等就需要用第二种方式 [[esp+参数个数*4+8]] 这里面的值就是Ring3的堆 ...

  4. Spring中属性文件properties的读取与使用

    实际项目中,通常将一些可配置的定制信息放到属性文件中(如数据库连接信息,邮件发送配置信息等),便于统一配置管理.例中将需配置的属性信息放在属性文件/WEB-INF/configInfo.propert ...

  5. LoadRunner编程之跳出迭代

    LoadRunner编程之跳出迭代 51Testing软件测试网3p6pK.Yo LoadRunner中 提供了函数exit(-1)来结束迭代. 使用return 0 来结束本次迭代,进入下一次迭代. ...

  6. SPOJ PHRASES 后缀数组

    题目链接:http://www.spoj.com/problems/PHRASES/en/ 题意:给定n个字符串,求一个最长的子串至少在每个串中的不重叠出现次数都不小于2.输出满足条件的最长子串长度 ...

  7. express－5 质量保证(2)

    跨页测试 跨页测试更有挑战性,因为需要你控制和观测浏览器. 现在设置一个跨页测试情境的例子.比如,你的网站上有一个包含联系表单的Request Group Rate页面.营销部门想知道客户是从哪个页面 ...

  8. The Unique MST（次小生成树）

    Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 22335   Accepted: 7922 Description Give ...

  9. java读取utf8配置文件乱码

    email.properties文件如果以ISO-8859-1编码,那么以下的java代码读取中文不会乱码,因为eclipse下中文都被翻译成/u... //in Conf.javaPropertie ...

  10. TODO软件工程--如何预算项目的工期

    我的项目后台接口已经开发好,是前人留下的接口,现在只需要和前端联调,本以为后台的开发周期短,可以提早上线,可以因为旧接口不兼容新的要求 不得不重新写,造成了工期的延误. 如何计算一个工期被提上日程.