滾動條示例

關於maquee:

首先說一下它的常用屬性:

scrollAmount :它表示速度,值越大速度越快。如果沒有它,默認爲6,建議設爲1~3比較好。

width和height:表示滾動區域的大小,width是寬度,height是高度。特別是在做垂直滾動的時候,一定要設height的值。

direction :表示滾動的方向,默認爲從右向左:←←←。可選的值有right、down、up。滾動方向分別爲:right表示→→→,up表示↑,down表示↓。 scrollDelay:這也是用來控制速度的,默認爲90,值越大,速度越慢。通常scrollDelay是不需要設置的。 

behavior:用它來控制屬性,默認爲循環滾動,可選的值有alternate(交替滾動)、slide(指的是滾動一次,然後停止滾動)trueSpeed:平滑滾動。

align:是設定活動字幕的位置,不過除了居左、居中、居右三種位置外,又增加靠上(align=top)和靠下(align=bottom)兩種位置。 

Bgcolor:用於設定活動字幕的背景顏色,一般是十六進制數

Loop:用於設定滾動的次數,當loop=-1表示一直滾動下去,直到頁面更新。

下面是一個簡單的示例:

橫向向右來回滾動:

<div style="border:1px solid">

<marquee acrollAmount=3 bgcolor=aaaaaa direction=right behavior=alternate >你好,歡迎光臨!

</marquee>

</div>

垂直向上循環滾動:

<div style="border:1px solid ; height:200px;width:150px">

<marquee acrollAmount=3 bgcolor=aaaaaa direction=up behavior=trueSpeed >你好,歡迎光臨!

</marquee>

</div>

可以在滾動條上加一些事件(下面是鼠標進入,離開事件)

<div style="border:1px solid ; height:200px;width:150px">

<marquee acrollAmount=3 bgcolor=aaaaaa direction=up behavior=trueSpeed οnmοuseοver=this.stop() οnmοuseοut=this.start()>

<a href="#">你好,歡迎光臨!</a>

</marquee>

</div>


可以根據需求用不同的屬性,用不同的屬性值來控制

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章