Js实现滚动变色的文字效果


Posted in Javascript onJune 16, 2014

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

以下是源代码:

<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>
Javascript 相关文章推荐
javascript数组使用调用方法汇总
Dec 08 Javascript
javascript+xml技术实现分页浏览
Jul 27 Javascript
javascript 日历提醒系统( 兼容所有浏览器 )
Apr 07 Javascript
jquery 注意事项与常用语法小结
Jun 07 Javascript
返回页面顶部top按钮通过锚点实现(自写)
Aug 30 Javascript
JS文本获得焦点清除文本文字的示例代码
Jan 13 Javascript
jQuery获得内容和属性示例代码
Jan 16 Javascript
jQuery构造函数init参数分析
May 13 Javascript
JavaScript实现标题栏文字轮播效果代码
Oct 24 Javascript
angularjs通过过滤器返回超链接的方法
Oct 26 Javascript
详解在React项目中安装并使用Less(用法总结)
Mar 18 Javascript
js实现点赞效果
Mar 16 Javascript
jquery模拟LCD 时钟的html文件源代码
Jun 16 #Javascript
Javascript图片上传前的本地预览实例
Jun 16 #Javascript
jquery的ajax异步请求接收返回json数据实例
Jun 16 #Javascript
Javascript判断图片尺寸大小实例分析
Jun 16 #Javascript
javascript进行数组追加方法小结
Jun 16 #Javascript
使用JavaScript实现网页版Pongo设计思路及源代码分享
Jun 16 #Javascript
jQuery切换网页皮肤并保存到Cookie示例代码
Jun 16 #Javascript
You might like
PHP 递归效率分析
2009/11/24 PHP
深入浅出php socket编程
2015/05/13 PHP
jQuery中:only-child选择器用法实例
2015/01/03 Javascript
javascript禁止访客复制网页内容的实现代码
2015/08/05 Javascript
jQuery实现布局高宽自适应的简单实例
2016/05/28 Javascript
jQuery解析返回的xml和json方法详解
2017/01/05 Javascript
基于JQuery的购物车添加删除以及结算功能示例
2017/03/08 Javascript
详解webpack 入门总结和实践(按需异步加载,css单独打包,生成多个入口文件)
2017/06/20 Javascript
JavaScript条件判断_动力节点Java学院整理
2017/06/26 Javascript
JS实现websocket长轮询实时消息提示的效果
2017/10/10 Javascript
使用Bootrap和Vue实现仿百度搜索功能
2017/10/26 Javascript
JS简单实现查看文档创建日期、修改日期和文档大小的方法示例
2018/04/08 Javascript
通过jquery的ajax请求本地的json文件方法
2018/08/08 jQuery
JavaScript实现构造json数组的方法分析
2018/08/17 Javascript
微信小程序实现发送验证码按钮效果
2018/12/20 Javascript
javascript实现切割轮播效果
2019/11/28 Javascript
利用JS判断元素是否为数组的方法示例
2021/01/08 Javascript
JavaScript 中的执行上下文和执行栈实例讲解
2021/02/25 Javascript
[52:14]VG vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
python文件读写操作与linux shell变量命令交互执行的方法
2015/01/14 Python
简单了解Python中的几种函数
2017/11/03 Python
使用keras实现densenet和Xception的模型融合
2020/05/23 Python
python exit出错原因整理
2020/08/31 Python
使用Python Tkinter实现剪刀石头布小游戏功能
2020/10/23 Python
一家专门经营包包的英国网站:MyBag
2019/09/08 全球购物
比较一下entity bean和session bean
2013/12/27 面试题
单位介绍信范文
2014/01/18 职场文书
学校元旦晚会开场白
2014/12/14 职场文书
家长给老师的感谢信
2015/01/20 职场文书
汽车销售员工作总结
2015/08/12 职场文书
python使用pygame创建精灵Sprite
2021/04/06 Python
JS Canvas接口和动画效果大全
2021/04/29 Javascript
python异常中else的实例用法
2021/06/15 Python
vue中使用mockjs配置和使用方式
2022/04/06 Vue.js
详细介绍MySQL中limit和offset的用法
2022/05/06 MySQL
使用opencv-python如何打开USB或者笔记本前置摄像头
2022/06/21 Python