IT源码网

滚动效果--marquee的使用

luoye 2019年11月29日 Web前端 622 0

1. <marquee></marquee>标签,默认从最右侧往左滚动;

2. marquee 支持的属性

   (1)behavior设置滚动方式:

<marquee behavior="alternate">我是来回滚动</marquee>
<marquee behavior="scroll">我是重复滚动</marquee>
<marquee behavior="slide">我是不重复滚动</marquee>

    (2)direction设置滚动方向:

 <marquee direction="up">我是向上滚动</marquee>
<marquee direction="down">我是向下滚动</marquee>
<marquee direction="left">我是向左滚动</marquee>
<marquee direction="right">我是向右滚动</marquee>

    (4)设置滚动次数:

<marquee loop="-1">我会一直滚动</marquee>
<marquee loop="2">我只滚动2次</marquee>

    (5).marquee 常用的事件:

<marquee onMouseOut="this.start()" >鼠标移出时滚动</marquee>

<marquee  onMouseOver="this.stop()">鼠标移入时停止滚动</marquee>

<!DOCTYPE html> 
<html> 
  <head> 
    <title>MyHtml.html</title> 
  </head> 
  <body> 
    <marquee onMouseOut="this.start()" onMouseOver="this.stop()" ><font size=3 color=red>Hello, World,CSS</font></marquee> 
  </body> 
</html>

 

评论关闭
IT源码网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!

npm常用命令的使用