スクロールメッセージのコード

2534 ワード

スクロールメッセージを作成するときによくある質問ですが、将来直接使用するためにまとめてみましょう.
<DIV class="box">
       <marquee scrollamount='1' scrolldelay='10' direction='up' width='180' height='173' onmouseover="this.stop()" onmouseout="this.start()" loop="-1">
        <UL class=lastedList>
            <LI><a href="">        0</a></LI>
            <LI><a href="">       1</a></LI>
            <LI><a href="">       2</a></LI>
            <LI><a href="">       3</a></LI>
            <LI><a href="">       4</a></LI>
            <LI><a href="">        5</a></LI>
            <LI><a href="">       6</a></LI>
            <LI><a href="">       7</a></LI>
            <LI><a href="">       8</a></LI>
            <LI><a href="">       9</a></LI>
            <LI><a href="">        10</a></LI>
            <LI><a href="">       11</a></LI>
            <LI><a href="">       12</a></LI>
            <LI><a href="">       13</a></LI>
            <LI><a href="">       14</a></LI>
            <LI><a href="">        15</a></LI>
            <LI><a href="">       16</a></LI>
            <LI><a href="">       17</a></LI>
            <LI><a href="">       18</a></LI>
            <LI><a href="">       19</a></LI>
        </UL>
        </marquee>
    </DIV>

 
.box { border:1px solid #CAE99B; border-top:none; padding:15px 0; }
UL.lastedList{ width:150px; margin:0 auto; }/*      height*/
.lastedListli { width:138px; height:20px; text-align:left; background:url(/images/arrow.gif) no-repeat 0 5px; padding-left:12px; }

  
marqueeのloopが無限ループを設定するには-1であることに注意しなければならない点がいくつかあります.またULの高さは必ず値を書くことができず、その高さはmarqueeのheightで制御しなければならない.BOX全体に一定の高さが必要な場合は、BOXを高さとして書きます.
もう一つ、ここのCSSは重要なDIVに対して属性を設定しただけで、具体的な場所を使うにはDIVにCSSを追加しなければならないので、この怠け者は盗めません.