html滚动字幕制作滚动字幕效果参数
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
html滚动字幕制作滚动字幕效果参数
制作滚动字幕效果:marquee标签如下:<MARQUEE direction=up height=146 onmouseout=start() onmouseover=stop() scrollAmount=4></marquee>
参数说明:
direction滚动方向:
up向上滚动,down向下滚动,left向左滚动,right向右滚动
behavior滚动方式:
scroll绕来绕去,slide滚动一次就停下来,alternate来回滚动
scrollAmount滚动速度:数值越大滚动越快
scrollDelay滚动延迟:数值越大延迟时间越长
loop循环次数:循环几次
bgcolor背景颜色
height高度
width宽度
onmouseout=start() onmouseover=stop()鼠标悬停停止,离开继续滚动
移动方式可以系属性果度改...下上左右都得...
滚动字幕的使用可以增加网页的动感,让网页显得更有生气。
当然用javascript可以实现滚动字幕效果;使用Dreamweaver的图层再用其时间轴功能可以做出非常漂亮的滚动看板。
但相对而言,用HTML的<marquee>滚动字幕标记所需的代码最少,虽然效果不是最好,但确实能够以较少的下载时间换来较好的效果。
该标记语法格式如下:
<marquee
aligh=left|center|right|top|bottom
bgcolor=<BR>
direction=left|right|up|down
behavior=<BR>
height=<BR>
hspace=<BR>
scrollamount=<BR>
Scrolldelay=<BR>
width=<BR>
VSpace=<BR>
loop= >
滚择不同的参数,滚动字幕会有不同的显示方式。
下面解释一下各参数的含义:
align:是设定滚动字幕的位置,除左、中、右三种位置外,还有靠上(align=top)和靠下(align=bottom)两种位置。
<BR> Bgcolor:用于设定滚动字幕的背景颜色。
Direction:用于设定滚动字幕的滚动方向。
Behavior:用于设定滚动的方式,
主要由三种方式:behavior="scroll"表示由一端滚动到另一端;behavior="slide":表示由一端快速滑动到另一端,且不再重复;behavior="alternate"表示在两端之间来回滚动。
<BR> Height:用于设定滚动字幕的高度
Width:则设定滚动字幕的宽度。
Hspace和vspace:分别用于设定滚动字幕的左右边框和上下边框的宽度。
Scrollamount:用于设定滚动字幕的滚动距离。
scrolldelay:用于设定滚动两次之间的延迟时间。
Loop:用于设定滚动的次数,当loop=-1表示一直滚动下去,直
到页面更新。
<marquee>标记的默认情况是向左滚动无限次,字幕高度是文本高度,滚动范围:水平滚动的宽度是当前位置的宽度;垂直滚动的高度是当前位置的高度。
应用技巧
1、垂直滚动
只要加上diriction="up"就行了,如
<marquee direction="up">向上滚动</marquee>
2、多行文本的滚动字幕
由于<mqrquee>标记只能作用于一段文本,因此多行滚动字幕,分行时只能用<br>标记,不能用<p>标记.
<marquee>
滚动字幕内容第一行<br>
滚动字幕内容第二行<br>
滚动字幕内容第三行
</marquee>
3、在字幕内容中加入图象
<marquee>虽是一个滚动字幕标记,但它允许在其中加入图象:
<marquee><img src="image/a2ball.gif" width="17" height="16">这是加入图象的滚动字幕</marquee>
<marquee>标记的参数较多,在应用中要把握一个原则,能用默认值就不要再设置参数值,用什么参数就设置该参数的值,其它参数就不要再设置,以把代码控制在最少的范围内。
用MARQUEE标签可以做文字或图片的简单的左右或上下移动。
并可以响应鼠标、加入链接。
不需要复杂的JS,只要一句简单的MARQUEE标签。
下面跟你介绍下标签中的参数设置。
点这里看示例文件。
(MARQUEE标签只有IE支持,在NC的浏览器上无效)
先看下代码:
<marquee id="iescroller" direction=left height=10 onMouseOut=start(); onMouseOver=stop(); scrollamount=2 scrolldelay=10 scrollleft="0" scrolltop="0" behavior="alternate" bgcolor="#999999" style="color: #ffffff; font-size: 14; font-family: '宋体', 'Arial','Helvetica', 'sans-serif'"title=文字内容> 这是放文字或需要移动的图片(光标放在这里时用INSERT命令就可以插入图片)</marquee>
下面来解释下各参数意思:
direction=left/right/up/down表示移动的方向可以是上下左右
BEHAVIOR 属性:改变marquee 标签内容移动的几种方式。
alternate滚动的内容会来回滚动。
scroll默认的从右到左的移动。
slide滚动结束后会停留在最后的位置上。
scrollAmount:定每显示一个marquee片段间的间距如scrollAmount =100
scrollDelay 指定每显示一个marquee片段间的时间差如scrollDelay = 1
LOOP:指定循环显示的次数,如 loop=3 还可以1,默认的值是无限循环
BGCOLOR:背景的颜色如 #990000 black 等都是有效的值
width:移动范围的长度如 width=300 也可以是百分数。
height:移动范围的高度如 height=50
Align <align=#> #=top, middle, bottom 表示居中位置
Margins <hspace=# vspace=#> 表示MARQUEE块在上下和左右方向留的空距。
title:鼠标移动marquee上时出现的说明好象<a href=# title="你好吗?">或图片的ALT那种。
style:你可加入风格的样式,如字体的颜色等STYLE="{color: #ffffff; font-family:Arial;font-size:8pt}"
stop的SCRIPT:可以令到滚动停止试试在<marquee>中加入onmouserover=this.stop
start 可以令到滚动重新开始试试在<marquee>中加入onmouserover=this.start
还可以有onbounce 触发当来回一次时触发的事件等等。
也可以用以下的javascript方式控制MARQUEE的鼠标响应:其中iescroller是MARQUEE的ID。
<SCRIPT LANGUAGE="javascript">
iescroller.onmouseover=new
Function("iescroller.scrollAmount=0");
iescroller.onmouseout=new
Function("iescroller.scrollAmount=2");
</SCRIPT>。