zoukankan      html  css  js  c++  java
  • HTML<marquee>标签实现滚动公告通知、广告的效果

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

    说一下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>
  • 相关阅读:
    shell中单引号、双引号、反斜杠简说
    shell脚本
    求素数
    SqlBulkCopy高效写入数据库Demo
    地图面面观之百望山
    FileUpload控件客户端验证
    如何将shapefile进行拆分
    Python 字符串操作
    如何重装oracle
    资料
  • 原文地址:https://www.cnblogs.com/lxgandlz/p/5331896.html
Copyright © 2011-2022 走看看