教你五分钟实现前端页面滚动信息的制作

marquee标签的介绍

这个标签是html里面用来制作滚动信息栏目的一个标签,而且这是个成对出现的闭合的标签.用起来类似于html里面很常规的标签.但是由于这个标签吧,很久都没使用了,现在我们也只是粗略介绍一下里面的一些个属性,主要部分还是得靠JavaScript来实现.

<marquee></marquee>

首先介绍这个标签的第一个属性:

1.behaviour

这个参数主要用来设置滚动的方式.
我们可以为这个标签设置alternative,scroll,slide这三种属性.

参数名称	作用
alternative	表示标签里面的元素在容器里面来回滚动
scroll	表示由一端滚动到另外一端,会重复
slide	表示从一端滚回到另外一端,但是滚完就停止

2.direction

这个属性主要来设置元素滚动的方向

参数名称	作用
down	向下
up	向上
left	向左
right	向右

3.loop

这个属性主要用于设置滚动的次数
值为-1的时候表示一直滚下去,默认的值为-1.
然后我们可以设置其他的值来设置这个的滚动次数.

4.scrollamount

此属性主要用于设定活动字幕的滚动字幕.

5.scrolldelay

这个属性用来设定活动字幕滚动两次之间的延迟时间.

<marquee scrollamount="2" behaviour="alternative" loop="3" direction="right" scrolldelay="500"></marquee>

借用这些知识以及一些css布局的技巧我们可以写出这样的一个滚动信息的界面.
html代码如下:

<div class="box">
<dl>
  <dt>文字滚动示例（默认）：</dt>
  <dd><marquee>我默认向左滚。。。。。</marquee></dd>
</dl>
<dl>
  <dt>文字滚动示例（向右）：</dt>
  <dd><marquee direction="right" scrolldelay="500">我向右滚动。。。。</marquee></dd>
</dl>
<dl>