本文描述了用JavaScript实现的原生态兼容IE6的可调控滚动文本功能。分享给大家参考，如下：

虽然HTML本身有一个跑马灯标签，用来设置滚动文本(跑马灯标签会在附录【HTML相对冷门的标签和属性】中具体介绍)，但是这个标签从IE8开始就不支持了，IE6中能设置的东西也很少，所以还是用javascript写比较好。这个小部件也很常见，但是在线代码质量为许多无关紧要的特效增加了许多无意义的代码。其实你只需要让自己左右滚动，自动回到屏幕边缘。为什么要为一些淡入淡出的华而不实的东西写很多代码？下面描述了一个使用左填充的自写滚动文本，因为左填充在大多数浏览器中仍然没有问题。

一、基本目标

如下图所示，首先，文本可以每0.05秒，5px像素，在15px-400px的区域内无缝滚动。当然，如果你改变下面的脚本，你可以让我从地球滚动到外太空，只要你告诉我地球的px和外太空的px，然后设置两个按钮。如果你点击“停止”，它就会停止。停止后，点击“开始”，它将启动。

第二，HTML布局

代码如下：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-Transitional . DTD ' html xmlns=' http://www . w3 . org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8 '/title marquee/title/headsdydivsssss/div div id=' marquee ' style=' padding-left :0 px；'marquee/divdivsssss/div button onclick=' return marquee _ move _ stop()' stop/button button onclick=' return marquee _ move _ start()' start/button/body/html思想如下，一图胜千言，所以不要说出来。请自己对照代码和图。

第三，剧本部分

这是整个控制的核心。

Script//将其滚动速度设置为5px/0.05s，可以实现无缝滚动，一卡不用。变化速度=5；var marqueeTimer=setInterval(' marquee _ move()'，50)；//这个变量主要用于以下两个功能来控制滚动的开始和停止：var isMarqueeMove=true//滚动核心函数函数marquee_move(){ //这段长代码主要用于将带px的padding-left转换为可操作的数字//如padding-left :0 px；在这一行代码之后，var marquee _ x=0；var marquee _ x=parseInt(document . getelementbyid(' marquee '). style . padding left . substring(0，document . getelementbyid(' marquee '). style . padding left . indexof(' px '))))；//如果在400px的位置上滚动，则向相反方向走，反之亦然如果(marquee _ x400){ speed=-5；}//这里不要设置为0，如果(marquee_x15){ speed=5可能会产生出界bug}//文本向右滚动5pxdocument . getelementbyid(' marquee ')。style . padding left=marquee _ xs speed“px”；}//以下两个控制滚动开始和停止的函数//设置标志是因为marquee timer=set interval(' marquee _ move()'，50)；如果多次执行，滚动会变得非常快，无法控制。//后面的计时器不会代替前面的计时器功能marquee _ move _ stop(){ if(ismarqueemove){清除超时(marquee timer)；isMarqueeMove=false} }函数marquee_move_start(){ if(！isMarqueeMove){ marqueeTimer=set interval(' marquee _ move()'，50)；isMarqueeMove=true} }/脚本四。摘要

1.在CSS中，所有带-的属性在javascript中都应该大写。例如，CSS的左填充在javascript中是paddingLeft，否则它将被视为减号

2.使用padding-left来完成这个组件，不需要用left来设置绝对定位，然后考虑如何放置这个组件。

3.这个东西在浏览器的百分比宽度内滚动，所以最好不要这样做。毕竟，在javascript中去掉浏览器的宽度可能会遇到各种兼容性问题。或者设置一个固定值，这个代码很短。

附件：HTML比较不受欢迎的标签和属性

1.hr标签可以添加水平分隔线。单个标签标签，属性宽度、大小、颜色、对齐(后跟值)noshade(直接添加，如在文本框中禁用，表示该水平线没有阴影)

2.marquee标签已被微软废除。

这个家伙微软已经放弃支持最新IE8下的MARQUEE了(我在这里无语了，MARQUEE是微软自己创建的，现在火狐支持，所以退出了)

选框有很多问题。DW给你一个提示，警告你要小心。

例如，以下代码在IE8中滚动时出现问题。图片滚动时会自动刷新，相当难看，无法无缝滚动。

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-Transitional . DTD ' html xmlns=' http://www . w3 . org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8 '/title scroll/title/headsdymarquee width=250 px行为=' scroll ' a href=' http://www . 163.com ' rel=' external nofollow ' img src=' http : img 0 . jpg ' width=100 hs pace=50//Aa href=' http://www . Baidu.com ' rel=' external nofollow ' img src=' http : img 28 . jpg。这是一种物理风格。Supsub双标签标签可以分别使字体上标和下标

4.copy是版权字符，reg是注册商标，nbsp是空格

5.对于图片，其hspace属性可以设置图片之间的距离。

6.body标签也是一个带有属性的vlink链接，可以分别设置已访问和未访问超链接的颜色，leftmargin和topmargin可以分别指定文档的左边距和上边距

7 . meta name=' keywords ' content=' search keywords ' meta name=' description content='网页描述'可以分别设置搜索引擎抓取的关键词和网页描述

更多对JavaScript相关内容感兴趣的读者可以查看本网站专题：《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript数学运算用法总结》、0103010。

希望本文对JavaScript编程有所帮助。