HTML标签marquee实现滚动效果

HTML标签marquee实现滚动效果


目录


一、标签属性
二、事件
三、实例
 
 


正文


  html标签 - <marquee></marquee>可以实现多种滚动效果，无需js控制。使用marquee标记不仅可以移动文字，也可以移动图片，表格等.只需要在<marquee></marquee>内部输入要滚动的内容即可。


回到顶部
一、标签属性
1.滚动方向direction（包括4个值：up、 down、 left和 right）


　　语法：<marquee direction="滚动方向">...</marquee>


2.滚动方式behavior（scroll:循环滚动，默认效果； slide:只滚动一次就停止； alternate:来回交替进行滚动）


　　语法：<marquee behavior="滚动方式">...</marquee>


3.滚动速度scrollamount（滚动速度是设置每次滚动时移动的长度，以像素为单位；如果没有它，默认为6，建议设为1～3比较好。）


　　语法：<marquee scrollamount="5">...</marquee>


4.滚动延迟scrolldelay（设置滚动的时间间隔，单位是毫秒，通常scrolldelay是不需要设置的。）


　　语法：<marquee scrolldelay="100">...</marquee>


5.滚动循环loop（默认值是-1，滚动会不断的循环下去）


　　语法：<marquee loop="2">...</marquee>


6.滚动范围width、height


7.滚动背景颜色bgcolor


8.空白空间hspace、vspace


 


回到顶部
二、事件
1.onmouseout()=“this.start()”:用来设置鼠标移出改区域时继续滚动


2.onmouseover()=“this.stop()”:用来设置鼠标移入改区域时停止滚动


 


回到顶部
三、实例
1.给滚动字幕添加超链接


<marquee scrollAmount=2 width=300><a href=http://www.cctv.com>中央电视台</a></marquee>
2.鼠标停留在文字上，文字停止滚动


<marquee scrollAmount=2 width=300 onmouseover=stop() onmouseout=start()>文字内容</marquee>
3.多行文本向上滚动


<marquee scrollAmount=2 width=300 height=160 direction=up>·早晨好啊！<br>·空气好清新啊<br>·今朝食乜好呢？<p>·<a href=http://www.cctv.com>中央电视台</a></marquee>　　
　　注意：如果你的网页经过了FrontPage编辑，保存之后，只能滚动一行，这时候你发现你原来的代码顺序已经变了，My god！解决的办法是，找出原来的代码，把它嵌入到JavaScript的document.write中即可，上述代码写为：


复制代码
<script>
    document.write('
        <marquee scrollAmount=2 width=300 height=160 direction=up>
        ·早晨好啊！<br>
        ·空气好清新啊<br>
        ·今朝食乜好呢？<p>
        ·<a href=http://www.cctv.com>中央电视台</a>
</marquee>
    ')
</script>                    
复制代码
 


转载自： https://www.cnblogs.com/jasmine-95/p/5432779.html 如有侵权请告知删帖


/*参考资料：


*1.http://www.cnblogs.com/mountain-mist/articles/975781.html


*2.http://www.cnblogs.com/zzuIvy/p/marqueeTest_1.html


*/