[代码收集]JS实现滚动变色的文字效果(交替变色/循环不断) - 笑忘书网页代码收藏馆 - 35230.WODEMO.COM

首页-代码 2014-02-17 10:01:59 -0500

★JS实现滚动变色的文字效果(交替变色/循环不断)★

请勿抄袭本页面

代码说明

JS实现滚动变色的文字效果，可看到文字在交替变色显示，吸引访客的注意，效果真心不错哦。代码中已有详细，请自行修改即可。转自源码爱好者

html代码

<script>
  var message="愿得一人心，白首不分离"
  var neonbasecolor="green"
//正常字体颜色
  var neontextcolor="yellow"
//最先出现的变动颜色
  var neontextcolor2="red"
//随后出现的变动颜色
  var flashspeed=120
//颜色变动的快慢，越小越快
  var flashingletters=3
//最先出现变动颜色的字数
  var flashingletters2=1
//随后出现变动颜色的字数
  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>

代码演示

[代码仅供参考，转载请注明出处]

----Comments(4)----
幻龙 (@fhl) | @ at 2014-02-18 20:31:
转走。。

csngmap (@csngmap) | @ at 2014-02-17 20:18:
转了…

ヾ明月醉淸風 (@1223302216) | @ at 2014-02-17 19:44:
转

Alexis (@alexiis010) | @ at 2014-02-17 16:25:
hello I am from Argentina

Subscribe | Register | Login | N