此JavaScript代码将在水平选框空间中不间断地移动包含您选择的任何文本的单个文本字符串。它通过将文本字符串的副本添加到滚动条的开头来完成此操作，只要文本字符串从选框空间的末尾消失。脚本会自动计算出需要创建多少份内容副本，以确保字幕中的文本永远不会用完。

这个脚本确实有一些限制，所以我们将首先讨论这些限制，以便您确切地知道您得到了什么。

• 该字幕提供的唯一交互功能是当鼠标悬停在字幕上时停止文本滚动。当鼠标移开时，它会再次开始移动。您可以在文本中包含链接，停止文本滚动的操作可以让用户更轻松地单击这些链接。
• 使用此脚本，可以在同一页面上有多个字幕，并且可以为每个字幕指定不同的文本。但是，所有的字幕都以相同的速率运行，这意味着停止滚动一个字幕的鼠标悬停会导致页面上的所有字幕停止滚动。
• 每个字幕中的文本必须全部在一行上。您可以使用内联HTML标记来设置文本样式，但是块标记和标记会破坏代码。

文本框的代码

要使用我的连续文本字幕脚本，首先需要复制以下JavaScript并将其保存为marquee.js。

这包括我的示例中的代码，它添加了两个新的mq对象，其中包含关于在这两个框中显示什么的信息。您可以删除其中一个并更改另一个以在页面上显示一个连续的选框，或者重复这些语句以添加更多的选框。在将选框定义为将处理旋转的后，必须通过mqr调用mqRotate函数。

函数start（）{new mq（'m1'）；new mq（'m2'）；mqRotate（mqr）；//必须在最后一个}window.onload=start；

//连续文本字幕//版权所有2009年9月30日斯蒂芬·查普曼//http://javascript.about.com// 如果在不改变函数objWidth（obj）{if（obj.offsetWidth）的情况下使用此脚本中的所有代码（包括这些//注释），则授予在网页上使用此Javascript的权限返回obj.offsetWidth；if（obj.clip）返回obj.clip.width；返回0；}var mqr=[]；functionmq（id）{this.mqo=document.getElementById（id）；var-wid=objWidth（this.mqo.getElementsByTagName（'span'）[0]）+5；var-fulwid=objWidth（this.mqo）；var-txt=this.mqo.getElementsByTagName（'span'）[0]。innerHTML；this.mqo.innerHTML=''；var-heit=this.mqo.style.style.height；this.mqo.onmouseout=function（）{mqRotate（mqr）；}；this.mqo.onmouseover=function（）{clearTimeout（mqr[0].TO）；}；this.mqo.ari=[]；var maxw=Math.ceil（fulwid/wid）+1；for（var i=0；i&lt；maxw；i++）{this.mqo.ari[i]=document.createElement（'div'）；this.mqo.ari[i].innerHTML=txt；this.mqo.ari[i].style.position='absolute'；this.mqo.ari[i].style.left=（wid*i）+'px'；this.mqo.widdary[i]].style.height=heit；this.mqo.appendChild（this.mqo.ary[i]）；}mqr.push（this.mqo）；}函数mqRotate（mqr）{if（！mqr）return；for（var j=mqr.length-1；j&gt；-1；j--{maxa mqr[j].ary.length；for（var i=0；imqr[j].ary[i].ary[i].style；x.left=（parseInt（x.left，10）-1）+'px'}var=mqr[j].ary[j].ari parsey]{var z=mqr[j].ary.shift（）；z.style.left=（parseInt（z.style.left）+parseInt（z.style.width）*maxa）+'px'；mqr[j].ary.push（z）；}}mqr[0].TO=setTimeout（'mqRotate（mqr）'10）；}

接下来，通过将以下代码添加到页面的标题部分，将脚本插入到网页中：

添加样式表命令

我们需要添加一个样式表命令来定义每个字幕的外观。

下面是我们在示例页面上使用的代码：

.marquee{位置：相对；溢出：隐藏；宽度：500px；高度：22px；边框：纯黑1px；}。marquee span{空白：nowrap；}

如果有外部样式表，您可以将其放置在外部样式表中，也可以将其括在页面头部的标记之间。

您可以为您的选框更改任何这些属性；但是，它必须保留。位置：相对

在网页上放置字幕

下一步是在网页中定义一个div，在其中放置连续文本字幕。

我的第一个示例字幕使用了以下代码：

那只敏捷的棕色狐狸跳过了那只懒狗。她在海边卖贝壳。

该类将其与样式表代码相关联。该id是我们将在新的mq（）调用中用于附加图像字幕的id。

字幕的实际文本内容位于跨度标记中的div内。span标记的宽度将用作选框中内容每次迭代的宽度（加上5个像素，仅用于将它们彼此隔开）。

最后，确保页面加载后添加mq对象的JavaScript代码包含正确的值。

下面是我们的一个示例语句：

新mq（'m1'）；

m1是div标签的id，因此我们可以识别要显示字幕的div。

向页面添加更多字幕

要添加额外的字幕，您可以在HTML中设置额外的div，在一个范围内为每个div提供自己的文本内容；如果你想改变字幕的样式，可以设置额外的类；并添加尽可能多的新mq（）语句。确保mqRotate（）调用跟随它们为我们操作字幕。