HTML标签实现滚动公告通知、广告的效果 antang1769 2016-03-29 10:05:00 638 收藏 2 文章标签: javascript 最后发布:2016-03-29 10:05:00首次发布:2016-03-29 10:05:00 原文链接:http://www.cnblogs.com/lxgandlz/p/5331896.html 版权 每当实现页面的时候遇到动态效果,首先

每当实现页面的时候遇到动态效果,首先想到的就是用js、jQuery插件来实现,之前为了实现公告通知从下往上轮播,搜了不少插件,但是都没有合适的,无意中搜到一个html标签,可以实现这个滚动效果。

说一下marquee的属性:

  behavior设定滚动的方式:

    alternate:来回滚动。
    scroll:   重复滚动。
    slide:    不重复滚动。

  bgcolor 设定活动字幕的背景颜色。

  direction设定活动字幕的滚动方向:

    up、down、left、right。

  width  设置活动字母的宽度。

  height 设置活动字母的高度。

  loop设定滚动的次数,当loop=-1表示一直滚动下去,默认为-1。

  scrollamount设定活动字幕的滚动速度,单位pixels。

  scrolldelay设定活动字幕滚动两次之间的延迟时间,单位millisecond(毫秒)值大了会有一步一停顿的效果。

marquee常用到的两个事件:
  onMouseOut="this.start()" 当鼠标移出该区域时
  onMouseOver="this.stop()" 当鼠标移入该区域时

代码如下:

DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>title>
    head>
    <body>
        <marquee direction="up" behavior="scroll" scrollamount="1" onmouseover="this.stop();" onmouseout="this.start();" scrolldelay="0" loop="-1" width="211" height="125">
                我是滚动的字幕
        marquee>
    body>
html>

 

转载于:https://www.cnblogs.com/lxgandlz/p/5331896.html

你可能感兴趣的:(javascript)