zoukankan      html  css  js  c++  java
  • marquee滚动语法

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>公告滚动JS代码</title>
    </head>
    <body>
    <div align="center">
    <table border="1" width="206" cellspacing="0" cellpadding="0" style="border-collapse: collapse" height="90"  id="table1">
    <tr>
    <td valign="top"><MARQUEE onmouseover=this.stop() onmouseout=this.start() scrollAmount=1 scrollDelay=100 direction=up height="99%">
     <TABLE cellSpacing=0 cellPadding=0 width="95%" align=center border=0>
         <TBODY>
          <TR>
            <TD vAlign=top height=120>
               <P style="LINE-HEIGHT: 150%;font-size:9pt"><FONT color=#000033>·<A href="#" >欢迎您光临!</A></FONT><BR><FONT color=#000033>·<A 
    href="#">更多很棒的源代码...</A></FONT><BR><FONT color=#000033>·<A  
    href="#">一个学习型的源码网站... </A></FONT><BR><FONT color=#000033>·<A href="#">如果有建议请提交给我们... </A></FONT><BR><FONT color=#000033>·<A href="#">非常感谢大家经常光顾</A></FONT><BR><FONT color=#000033>·<A href="#">再次感谢大家,再见</A></FONT>
    </TD></TR></TBODY></TABLE></MARQUEE></td>
    </tr>
    </table>
    </div>
    </body>

    </html>



    --------------------------------------------------------------------------------------------------------------------------------------------------------------



    <MARQUEE behavior="scroll" contenteditable="true" onstart="this.firstChild.innerHTML+=this.firstChild.innerHTML;" scrollamount="3" width="100"><SPAN unselectable="on"></SPAN></MARQUEE>
    <DIV id="scrollobj" style="white-space:nowrap;overflow:hidden;500px;" onmouseover="aa()" onmouseout="b()" >
    [CROSSSELLING3]
    [CROSSSELLING4]
    [CROSSSELLING5]
    [CROSSSELLING6]
    [CROSSSELLING7]
    [CROSSSELLING8]
    [CROSSSELLING9]
    [CROSSSELLING10]</DIV>
    <script language="javascript" type="text/javascript">
    <!--
    	function scroll(obj) {
    		var tmp = (obj.scrollLeft)++;
    		//当滚动条到达右边顶端时
    		if (obj.scrollLeft==tmp) obj.innerHTML += obj.innerHTML;
    		//当滚动条滚动了初始内容的宽度时滚动条回到最左端
    		if (obj.scrollLeft>=obj.firstChild.offsetWidth) obj.scrollLeft=0;
    	}
    	var a =	setInterval("scroll(document.getElementById('scrollobj'))",20);
    	function aa(){
    		clearInterval(a);
    	}
    	function b(){
    		a=setInterval("scroll(document.getElementById('scrollobj'))",10);
    	}
    //-->
    </script>




    <marquee></marquee>

    以下是一个最简单的例子:

    代码如下:
    <marquee><font size=+3 color=red>Hello, World</font></marquee>
     
    下面这两个事件经常用到:
    onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动
    onMouseOver="this.stop()":用来设置鼠标移入该区域时停止滚动
    代码如下:
    <marquee onMouseOut="this.start()" onMouseOver="this.stop()">onMouseOut="this.start()" :用来设置鼠标移出该区域时继续滚动 onMouseOver="this.stop()":用来设置鼠标移入该区域时停止滚动</marquee>
     
    这是一个完整的例子:

    代码如下:
    <marquee id="affiche" align="left" behavior="scroll" bgcolor="#FF0000" direction="up" height="300" width="200" hspace="50" vspace="20" loop="-1" scrollamount="10" scrolldelay="100" onMouseOut="this.start()" onMouseOver="this.stop()">
    这是一个完整的例子
    </marquee>
     

    该标签支持的属性多达11个:
     

    align
    设定<marquee>标签内容的对齐方式
    absbottom:绝对底部对齐(与g、p等字母的最下端对齐)
    absmiddle:绝对中央对齐
    baseline:底线对齐
    bottom:底部对齐(默认)
    left:左对齐
    middle:中间对齐
    right:右对齐
    texttop:顶线对齐
    top:顶部对齐

    代码如下:
    <marquee align="absbottom">align="absbottom":绝对底部对齐(与g、p等字母的最下端对齐)。 </marquee>
    <marquee align="absmiddle">align="absmiddle": 绝对中央对齐。 </marquee>
    <marquee align="baseline">align="baseline": 底线对齐。 </marquee>
    <marquee align="bottom">align="bottom": 底部对齐(默认)。 </marquee>
    <marquee align="left">align="left": 左对齐。 </marquee>
    <marquee align="middle">align="middle": 中间对齐。 </marquee>
    <marquee align="right">align="right": 右对齐。 </marquee>
    <marquee align="texttop">align="texttop": 顶线对齐。 </marquee>
    <marquee align="top">align="top": 顶部对齐。 </marquee>
     

    behavior
    设定滚动的方式:
    alternate: 表示在两端之间来回滚动。
    scroll: 表示由一端滚动到另一端,会重复。
    slide:  表示由一端滚动到另一端,不会重复。
    代码如下:
    <marquee behavior="alternate">alternate:表示在两端之间来回滚动。 </marquee>
    <marquee behavior="scroll">scroll:表示由一端滚动到另一端,会重复。</marquee>
    <marquee behavior="slide">slide:  表示由一端滚动到另一端,不会重复。</marquee>
     

    bgcolor
    设定活动字幕的背景颜色,背景颜色可用RGB、16进制值的格式或颜色名称来设定。
    代码如下:
    <marquee bgcolor="#006699">设定活动字幕的背景颜色 bgcolor="#006699"</marquee>
    <marquee bgcolor="RGB(10%,50%,100%,)">设定活动字幕的背景颜色 bgcolor="rgb(10%,50%,100%,)"</marquee>
    <marquee bgcolor="red">设定活动字幕的背景颜色 bgcolor="red"</marquee>
     

    direction
    设定活动字幕的滚动方向
    代码如下:
    <marquee direction="down">设定活动字幕的滚动方向direction="down":向下</marquee>
    <marquee direction="left">设定活动字幕的滚动方向direction="left":向左</marquee>
    <marquee direction="right">设定活动字幕的滚动方向direction="right":向右</marquee>
    <marquee direction="up">设定活动字幕的滚动方向direction="up":向上</marquee>
     

    height
    设定活动字幕的高度
    代码如下:
    <marquee height="500" direction="down" bgcolor="#CCCCCC">设定活动字幕的高度height="500"</marquee>
     

    width
    设定活动字幕的宽度
    代码如下:
    <marquee width="500" bgcolor="#CCCCCC">设定活动字幕的宽度width="500"</marquee>
     
    hspace
    设定活动字幕里所在的位置距离父容器水平边框的距离
    This controls the horizontal(水平)space around the display box.
    代码如下:
      <table width="500" border="1" align="center" cellpadding="0" cellspacing="0">
        <tr>
          <td><marquee hspace="100" bgcolor="#CCCCCC">hspace="100"</marquee></td>
        </tr>
      </table>
     

    vspace
    设定活动字幕里所在的位置距离父容器垂直边框的距离
    This controls the vertical(垂直) space around the display box.
    代码如下:
    <marquee vspace="100" bgcolor="#CCCCCC">hspace="100"</marquee>
     
    loop
    设定滚动的次数,当loop=-1表示一直滚动下去,默认为-1
    代码如下:
    <marquee loop="-1" bgcolor="#CCCCCC">我会不停地走。</marquee>
    <p>&nbsp;</p>
    <marquee loop="2" bgcolor="#CCCCCC">我只走两次哦</marquee>
     

    scrollamount
    设定活动字幕的滚动速度,单位pixels
    代码如下:
    <marquee scrollamount="10" >scrollamount="10" </marquee>
    <marquee scrollamount="20" >scrollamount="20" </marquee>
    <marquee scrollamount="30" >scrollamount="30" </marquee>
     

    scrolldelay
    设定活动字幕滚动两次之间的延迟时间,单位millisecond(毫秒)
    值大了会有一步一停顿的效果
    代码如下:
    <marquee scrolldelay="10" >scrolldelay="10" </marquee>
    <marquee scrolldelay="100" > scrolldelay="100"</marquee>
    <marquee scrolldelay="1000">scrolldelay="1000" </marquee>

  • 相关阅读:
    大小写英文字母表
    JSP作业
    第六次作业
    第五次作业
    第二次作业
    JSP第一次作业
    作业9
    作业八
    作业7
    第二次作业
  • 原文地址:https://www.cnblogs.com/lpshan/p/4390758.html
Copyright © 2011-2022 走看看