一、前言
有限的空間展現無限的內容,這是滾動最常用到的地方。根據信息滾動效果我們可以有很多的實現方式,但HTML自帶的 marquee標簽 是其中一個較簡單的實現方式。下面記錄一下,供日后查閱。
二、 marquee標簽 的基礎知識
示例:
<marquee behavior="scroll" direction="left" loop="-1" scrollAmount="12" scrollDelay="42">
滾動的信息 </marquee>
屬性
behavior ,滾動的方式。 值alternate 表示在兩端之間來回滾動; 值scroll 表示由一端重復滾動到另一端,為默認值; 值slide 表示由一端不重復地滾動到另一端。
direction , 滾動的方向。取值范圍為 left(默認值) , right , up 和 down 。
loop ,滾動的次數。默認值-1表示一直滾動。
scrollAmount , 設置一次滾動的步長。默認值為6, 當設置為負數時將采用默認值進行滾動。
scrollDelay ,設置兩次滾動間的延遲時間(單位:ms)。默認值為85,當設置為負數時將采用默認值進行滾動。
三、鼠標懸浮暫停滾動、移除即恢復滾動
<marquee onmouseover="this.stop();" onmouseout="this.start();"> 滾動的消息 </marquee>
四、總結
當我們只需實現當條特別公告等簡單信息滾動效果時,marquee標簽是一個很不錯的選擇(雖然HTML5中已經將其廢除並建議使用CSS3動畫效果代替)
尊重原創,轉載請注明來自:http://www.cnblogs.com/fsjohnhuang/p/4009914.html ^_^肥仔John