２００５．１教育传播 与技 术 （总第４４期） 媒 体 技 术 应 用
用ＪａｖａＳｃｒｉｐｔ和 ＡＳＰ制作连续滚动的字幕
牛贵珍
（育才中学， 上海 ２０１８０１）
摘 要：网站建设中经常要用到制作滚动字幕的技术，一般的程序设计书上没有现成的答案，现将编程代码提供给学校的网
站技术管理员，供参考使用。
关键词：ＪａｖａＳｃｒｉｐｔ ＡＳＰ 滚动字幕
我校的网站最近进行了彻底的改版，从信息更新
的时效性、资料保留的价值性、网站维护的角度等方
面，我们结合数据库设计制作了一个动态的网站。在
制作过程中，对一些技术问题进行了探索，也学到了
一
些新的知识，现将制作字幕连续滚动的方法介绍给
大家，希望能对做网站的朋友有点帮助。在此首先说
明以下，大家不要害怕不懂得程序设计，不要有读
ＪａｖａＳｃｒｉｐｔ程 序如 同读天书 的感觉 ，其实只 要将
ＪａｖａＳｃｒｉｐｔ程序代码复制到网页的 ｈｔｍｌ中再修改几个
主要的参数就可以了；计算机技术突飞猛进，我们不
必掌握所有的技术，只要能达到 自己所需要的效果就
可 以了。
首先看一下制作连续滚动字幕的方法。大家都知
道，无论是用 ＦｒｏｎｔＰａｇｅ还是用 Ｄｒｅａｍｗｅａｖｅｒ制作字
幕用的都是 Ｍａｒｑｕｅｅ标签，而用 Ｍａｒｑｕｅｅ制作的滚动
是不连续的，每滚完一幕，就会出现一次空白，大大
影响了网页的美观。为解决此问题，我查阅了有关资
料，了解到编写ＪＡＶＡＳＣＲＩＦｒ程序可以制作连续、不
间断的滚动字幕。
制作连续滚动的原理：为了滚动能够“连续”，需
要将字幕的内容复制多遍，直到内容的高度不小于滚
动区高度的两倍。然后我们将溢出的滚动条隐藏掉，
用代码控制滚动条向下移动 （这时内容将向上移动）。
当滚动条滚动到最下方时，理论上不能再往下滚动了，
于是我们立刻调整滚动条，将它向上滚动到和当前画
面一样的位置。结果看到的就是连续滚动的字幕。下
面就是制作连续滚动字幕的程序代码：
１．＜ｄｉｖ ｉｄ＝”ｍａｒｑｕｅｅｓ”＞
２．＜！一定义了一个名为”ｍａｒｑｕｅｅｓ”的层，并在下
面将字幕的内容放在”ｍａｒｑｕｅｅｓ”层中，这些是字幕的
内容，可以任意定义 —＞
３．＜ａ ｈｒｅｆ－－”撑”＞通 知 （１１．２３）：各 位 班 主
任 …＜／ａ≥
４．＜ａｈｒｅｆ－－” ’＞喜报 （１１．２５）：在 ２００４年上海市
学生艺术…＜，ａ＞（ｂｒ＞
５．＜ａ ｈｒｅｆ－－’嵴”＞通 知 （１１．２５）：高 二年 级定
于…＜／ａ＞＜ｂｒ＞
６．＜ａｈｒｅｆ－－”撑”＞喜报 （１１．２６）：在 ２００４年上海市
中学生数学…＜，ａ＞（ｂｒ＞
７．＜！一字幕内容结束 ＿＞
８．＜／ｄｉｖ＞
９．＜！一 以下是
．
ｊａｖａ－ｓｃｒｉｐｔ代码 ＿＞
１０． ＜ｓｃｒｉｐｔ ｌａｎｇｕａｇ￣ ”ＪａｖａＳｃｒｉｐｔ”＞
１１．ｍａｒｑｕｅｅｓｗｉｄｔｈ＝３００；臌 动区的宽度。
１２．ｍａｒｑｕｅｅｓＨｅｉｇｈｔ＝１３０；臌 动区的高度。
１３．ｓｔｏｐｓｃｒｏＵ＝ｆａｌｓｅ；／／这个变量控制是否停止滚
动，这里将内容设置为滚动；以下是对上面定义的
ｍａｒｑｕｅｅｓ层的设置。
１４．ｗｉｔｈ（ｍａｒｑｕｅｅｓ）｛
１５．ｓｔｙｌｅ．ｗｉｄｔｈ＝３００；
１６．ｓｔｙｌｅ．ｈｅｉｇｈｔ＝ｍａｒｑｕｅｅｓＨｅｉｇｈｔ；
１７．ｓｔｙｌｅ．ｏｖｅｒｆｌｏｗＸ＝”ｖｉｓｉｂｌｅ”；
１８．ｓｔｙｌｅ．ｏｖｅｒｆｌｏｗＹ＝”ｈｉｄｄｅｎ”∥滚动条不可见。
１９．ｎｏＷｒａｐ＝ｆａｌｓｅ；／／这旬设置内容区自动换行。
２０．ｓｔｙｌｅ．ｗｉｄｔｈ＝３００；／／于是我们可以将它的宽度设
为 ３００，固定宽度。
２１．ｏｎｍｏｕｓｅｏｖｅｒ－－ｎｅｗ Ｆｕｎｃｔｉｏｎ（”ｓｔｏｐｓｃｒｏｌｌ＝
ｔｒｕｅ”）；／／鼠标经过，停止滚动。
２２．ｏｎｍｏｕｓｅｏｕｔ－－ｎｅｗ Ｆｕｎｃｔｉｏｎ（”ｓｔｏｐｓｃｒｏＵ＝ｆａｌｓｅ”）；
，／鼠标离开，继续滚动。
２３．），，ｉ 时候，内容区的高度是无法读取了。下
面输出一个不可见的层”ｔｅｍｐｌａｙｅｒ”，稍后将内容复制
维普资讯 http://www.cqvip.com
