曲径通幽论坛

标题: marquee 标签 -- 移动内容(文字，图片，表格等) [打印本页]

作者: beyes 时间: 2016-12-9 23:05
标题: marquee 标签 -- 移动内容(文字，图片，表格等)
直接使用 <marquee>hello world</marquee> 时的所包围的文字 hello world 跑马灯移动，默认从右到左移动。

可以使用 direction 属性来控制移动的方向：

[HTML] 纯文本查看 复制代码

<marquee direction="left"> 从右向左移动 </marquee>

<marquee direction="right">从左到右移动</marquee>

<marquee direction="up">从下到上移动</marquee>

<marquee direction="down">从上到下移动</marquee>

可以用 behavior 控制于东的方式：

[HTML] 纯文本查看 复制代码

<marquee behavior="scroll">一圈一圈的走，这也是默认的游走方式</marquee>

<marquee behavior="slide">只走一次就停住，靠在浏览器窗口的休息</marquee>

<marquee behavior="alternate">来回走，也就是碰到浏览器窗口边缘就折返。注意与 scroll 的区别</marquee>

用 loop 来控制循环的次数，如果不指定，就是无休止的循环：

[HTML] 纯文本查看 复制代码

<marquee loop="3" width="50%" behavior="scroll"> hello world </marquee>

上面代码只控制走 3 趟，width 声明 hello world 的活动区域只是 50% 的浏览器窗口区域。

用 scrollamount 来控制行走的速度，值越高越快，像素为单位。

用 scrolldelay 控制行走的延迟，效果就是走一步停一下，如：

[HTML] 纯文本查看 复制代码

<marquee scrollamount="100" scrolldelay="3000"> hello world </marquee>

上面代码表示，每次跑 100 个像素，然后停个 3 秒再动。但是有些“极速”浏览器并不吃这一套，scrolldelay 没有效果，也就是不会看到停顿的现象，而是解析成延缓速度（很慢的走，但不会停顿）。

欢迎光临曲径通幽论坛 (http://www.groad.net/bbs/)