软件开发培训班 >> 编程开发 >> JavaScript

js实现的文字横向无间断滚动

　　本文标签：文字,横向滚动

<style type="text/css"> 
#gongao{width:1000px;height:30px;overflow:hidden;line-height:30px;font-size:13px;font-family:宋体;background:#DDE5ED;color:#0C77CF;font-weight:bold;} 
#gongao #scroll_begin, #gongao #scroll_end{display:inline} 
</style> 
<script type="text/javascript"> 
function ScrollImgLeft(){ 
var speed=50; 
var scroll_begin = document.getElementById("scroll_begin"); 
var scroll_end = document.getElementById("scroll_end"); 
var scroll_div = document.getElementById("scroll_div"); 
scroll_end.innerHTML=scroll_begin.innerHTML; 
function Marquee(){ 
if(scroll_end.offsetWidth-scroll_div.scrollLeft<=0) 
scroll_div.scrollLeft-=scroll_begin.offsetWidth; 
else 
scroll_div.scrollLeft++; 
} 
var MyMar=setInterval(Marquee,speed); 
scroll_div.onmouseover=function() {clearInterval(MyMar);} 
scroll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed);} 
} 
</script> 
<div id="gongao"> 
<div style="width:900px;height:30px;margin:0 auto;white-space: nowrap;overflow:hidden;" id="scroll_div" class="scroll_div"> 
<div id="scroll_begin"> 
${affiche.content} ${affiche.content} ${affiche.content} 
${affiche.content} ${affiche.content} ${affiche.content} 
</div> 
<div id="scroll_end"></div> 
</div> 
<script type="text/javascript">ScrollImgLeft();</script> 
</div>

技术文章快速查找

基于jquery的网站幻灯片切换效果焦点图代码

js和as的稳定传值问题解决

基于jquery的$.ajax async使用

基于jquery的一行代码轻松实现拖动效果

JavaScript实现Sleep函数的代码

JavaScript高级程序设计阅读笔记（十五）浏览器中的JavaScript

IE,firefox(火狐)浏览器无提示关闭窗口js实现代码小结

有效的捕获JavaScript焦点的方法小结

相关下载

在线教程导航

软件应用
·Windows8	·Windows7	·Word
·Excel	·PPT	·WPS
Web开发
·ASP	·JavaScript	·DIV+CSS
·JSP	·VbScript	·XML
·PHP
开发语言
·VB	·VC	·ASP.NET
·Java	·C++	·Delphi
数据库开发
·MySQL	·MsSQL	·Access
·Oracle	·DB2
手机系统
·Android	·iOS	·WindowsPhone
网站设计
·Flash	·Dreamweaver	·Fireworks
平面设计
·Photoshop	·CorelDraw	·AutoCAD
·3DsMAX	·Illustrator
网络技术
·网站运营	·网络安全	·网络搭建