HTML5如何實現文字滾動效果

這篇文章為大家介紹一下HTML5實現文字滾動效果的方法。有一定的參考價值，有需要的朋友可以參考一下，希望對大家有幫助。

HTML5實現文字滾動效果

<div class="custom-notice">
   <i class="icon-notice"></i>
   <marquee class="noticeText ng-binding" direction="left" behavior="alternate" scrollamount="100" scrolldelay="1000" loop="5" width="100%" onmouseover="this.stop();" onmouseout="this.start();"  style="width: 100%;">充值公告：首充100送1元</marquee>
</div>

1.

該屬性的滾動方向可以設定四個值:up（文字向上）、down（文字向下）、left（文字向左）、right（文字向右）。

2.滾動方式屬性behavior

該屬性的取值有三個值：scroll（循環滾動，預設效果）、slide(只滾動一次就停止) 、alternate(來回交替進行滾動)

3.滾動速度屬性scrollamount

該屬性能調整文字滾動的速度，滾動文字的速度實際上是透過設定滾動文字每次移動的長度來實現的，以像素為單位。數值只寫數字，不帶px單位，若帶了單位設定無效。

4.滾動延遲屬性 scrolldelay

此屬性用來設定滾動文字滾動的時間間隔（滾動兩步之間的時間間隔）。

scrolldelay的時間間隔單位是毫秒，取值只寫數字

5.滾動循環屬性loop

設定滾動文字後，預設會設定滾動文字後，預設會無限循環下去，若想控制循環的次數，可設定此屬性。

6.滾動範圍屬性 width&height

若想控製文字滾動的範圍，則可起用這二屬性，以像素為單位，不寫px單位。預設情況下left和right滾動的width和瀏覽器視窗同寬，搞定和文字高度同高。 up和down時height為瀏覽器視窗高度的三分之一。

7.捲動背景顏色屬性 bgcolor

此屬性為捲動區域設定背景色(取值為十六進位顏色碼和英文)。

8.滾動空間屬性 hspace&vs​​pace

hsapce屬性可以設定滾動範圍的水平位置，vspace用來設定滾動範圍的垂直位置。單位均為像素，寫值時不寫單位px。

更多程式相關知識，請造訪：程式設計入門！ ！