在一行范围内无间断的文字滚动代码

2024-09-05 12:21:18

字体：大中小

来源：转载

供稿：网友

在一行内无间断（无缝滚动）文字滚动的特效代码，鼠标放上后自动停止滚动，可以定义鼠标悬停时的颜色、链接颜色等，小巧，精致，不占用网页布局空间，方便实用。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无间断滚动切换效果</title><style type="text/css" media="all">.scroll{height:22px;overflow:hidden;font-size:9pt;line-height:20px;border:#0066cc 1px dashed;width:116px;margin:0px auto;text-align:center;}</style><script language="javascript" type="text/javascript">var s,sn=0,timer,slen,timer2;function scrollInit(){  s=getid("s1"); s.scrollTop=0; slen=s.innerHTML.split("|"); s.innerHTML=""; for(var i=0;i<slen.length;i++){s.innerHTML+=(slen[i]+"<br />");} s.innerHTML+=slen[0]; timer2=setInterval(scrollstart,3000); s.onmouseover=function(){clearInterval(timer2);clearInterval(timer);s.style.backgroundColor="skyblue";} s.onmouseout=function(){timer2=setInterval(scrollstart,2980);s.style.backgroundColor="#f5f5f5";}}function scrollstart(){ if(s.scrollTop>=(slen.length*20)){s.scrollTop=0;} timer=setInterval(scrollexec,30);  }function scrollexec(){ if(sn<20){  sn++;  s.scrollTop++;  }else{   sn=0;   clearInterval(timer);   }   }function getid(id){return document.getElementById(id);}window.onload=scrollInit;</script></head><body><div id="s1" class="scroll">ASP源程序|PHP技术交流区|论坛社区|欢迎您的光临</div></body></html>

上一篇：Css 渐变文字效果

下一篇：CSS文字竖排显示

学习交流

如何查找有故障的配件

如何查找有故障的配件...

热门图片

猜你喜欢的新闻

猜你喜欢的关注