Js实现滚动变色的文字效果，在效果展示页面，可看到文字在交替变色显示，以吸引人的注意，效果真心不错哦，把代码拷贝到你的网站后，修改成想要的文字就OK了。

查看效果：http://keleyi.com/a/bjad/bd55blos.htm

以下是源代码：

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>滚动变色的文字js特效-柯乐义</title>

 </head>

 <body>

 <div style="width:736px;">

 请注意下方的文字，部分文字染成红色，且红色循环移动。 <a href="http://keleyi.com/a/bjad/bd55blos.htm" target="_blank">原文</a>

 </div>

 <script type="text/javascript">

 var message="欢迎访问柯乐义网，这里有web前端等学习资料。"

 var neonbasecolor="#333333"

 var neontextcolor="#ff0000"

 var neontextcolor2 = "#ff3333"

 var flashspeed=100

 var flashingletters=8

 var flashingletters2=2

 var flashpause=0

 var n=0

 if (document.all||document.getElementById){

 document.write('<font color="'+neonbasecolor+'">')

 for (m=0;m<message.length;m++)

 document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')

 document.write('</font>')

 }

 else

 document.write(message)

 function crossref(number){

 var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)

 return crossobj

 }

 function neon(){

 if (n==0){

 for (m=0;m<message.length;m++)

 crossref(m).style.color=neonbasecolor

 }

 crossref(n).style.color=neontextcolor

 if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2

 if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor

 if (n<message.length-1)

 n++

 else{

 n=0

 clearInterval(flashing)

 setTimeout("beginneon()",flashpause)

 return

 }

 }

 function beginneon(){

 if (document.all||document.getElementById)

 flashing=setInterval("neon()",flashspeed)

 }

 beginneon()

 </script>

 <div><br /><a href="http://keleyi.com" target="_blank">keleyi.com</a></div>

 </body>

 </html>

web前端：http://www.cnblogs.com/jihua/p/webfront.html

滚动变色的文字js特效的更多相关文章

  1. 带左右箭头切换的自动滚动图片JS特效

    效果图 按钮 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  2. 鼠标点击自定义文字展现特效JS代码

    JS特效使用方法 只需将如下JS代码放到</body>之前就好了 var a_idx = 0; jQuery(document).ready(function($) { $("b ...

  3. 150个JS特效脚本

    收集了其它一些不太方便归类的JS特效,共150个,供君查阅. 1. simplyScroll simplyScroll这个jQuery插件能够让任意一组元素产生滚动动画效果,可以是自动.手动滚动,水平 ...

  4. jQuery.smoove — jQuery和CSS3炫酷滚动页面内容元素动画特效插件

    插件介绍: jQuery-smoove是一款jQuery和CSS3炫酷滚动页面内容元素动画特效插件.该内容元素动画插件在页面滚动到指定位置时,该位置的HTML元素会执行指定的CSS3动画特效,如旋转. ...

  5. 基于jQuery图片遮罩滑动文字切换特效

    基于jQuery图片遮罩滑动文字切换特效.这是一款jquery hover鼠标滑动选项卡切换透明背景遮罩文字显示特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div ...

  6. 1.纯 CSS 创作一个按钮文字滑动特效 + 弹幕（残缺）

    原文地址:1# 视频演示如何用纯 CSS 创作一个按钮文字滑动特效 扩展后地址:https://scrimba.com/c/cJkzMfd HTML代码: <html> <head& ...

  7. js特效 15个小demo

    js特效和15个小demo 代码如下:images文件夹未上传 1.图片切换: <!DOCTYPE html> <html> <head> <title> ...

  8. 分享十个CSS3鼠标滑过文字动画特效

    介绍10组基于CSS3的鼠标滑过文字动画特效,有上凸.下凹等文字动画.这些炫酷的CSS3文字效果可以让网页变得更加绚丽.效果图如下: 在线预览   源码下载 实现的代码. html代码: <h2 ...

  9. <一>初探js特效魅力之全选不选反选04

    初探js特效魅力04 我们在进入到公司里面工作的时候,做一个同一个项目,经常是大家分工合作,当我们写css时,一般不写在行间,因为这样会被误操作,也就是被乱删了都不知道,这样的后果是很难检查的 ,因为 ...

随机推荐

  1. SSISDB6：Operation

    SSISDB使用Operation表示对SSIS Project所做的任何操作,在执行一次Operation时,SSISDB会记录Operation的Message,当触发Event时,会记录Even ...

  2. 数据结构与算法JavaScript (一) 栈

    序 数据结构与算法JavaScript这本书算是讲解得比较浅显的,优点就是用javascript语言把常用的数据结构给描述了下,书中很多例子来源于常见的一些面试题目,算是与时俱进,业余看了下就顺便记录 ...

  3. 安装CentOS、Linux系统时,GPT分区不能引导的解决方法

    安装系统:CentOS 5.9_64bit时,分区后, 提示如下错误. 解决方法: 1.按ctrl+alt+F2 进入命令行 2.先查看分区 sh #fdisk -l    以下假设分区是/dev/s ...

  4. MySql联接算法

    联接算法是MySql数据库用于处理联接的物理策略.在MySql 5.5版本仅支持Nested-Loops Join算法,如果联接表上有索引时,Nested-Loops Join是非常高效的算法.如果有 ...

  5. .Net 转战 Android 4.4 日常笔记（1）--工具及环境搭建

    闲来没事做,还是想再学习一门新的技术,无论何时Android开发比Web的开发工资应该高40%,我也建议大家面对移动开发,我比较喜欢学习最新版本的,我有java的基础,但是年久,已经淡忘,以零基础学习 ...

  6. Android启动icon切图大小

    我们在给app切图的时候不知道告诉ui启动图标切多大,其实你新建一个android项目就知道应该切多大了.新建一个项目会产生几种大小的启动图标. 我把各个文件夹下的ic_launcher.png文件都 ...

  7. 使用jQuery封装实用函数

    一.引言 项目开发中,前端会有一个辅助工具类的js文件,比如cookie的操作,团队成员自己封装的方法.大多数时候,我们开发人员自己都是写一个全局函数,不考虑后期维护人员也会写相同的代码,然后造成代码 ...

  8. etlpy: 并行爬虫和数据清洗工具（开源）

    etlpy是python编写的网页数据抓取和清洗工具,核心文件etl.py不超过500行,具备如下特点 爬虫和清洗逻辑基于xml定义,不需手工编写 基于python生成器,流式处理,对内存无要求 内置 ...

  9. 从客户端(&)中检测到有潜在危险的 Request.Path 值

    首先,这个问题出现在 ASP.NET MVC 应用程序中,所以下面的解决方式都是在这个环境下. 关于这个问题,网上又很多的答案,当时也搜了一些: A potentially dangerous Req ...

  10. geotrellis使用（三）geotrellis数据处理过程分析

    之前简单介绍了geotrellis的工作过程以及一个简单的demo,最近在此demo的基础上实现了SRTM DEM数据的实时分析以及高程实时处理,下面我就以我实现的上述功能为例,简单介绍一下geotr ...