標籤之美六——滾動字幕的應用

時間 2019-11-15

標籤標籤之美滾動應用简体版

原文原文鏈接

標籤之美——滾動字幕的應用

在網頁中，咱們常常能夠看到一些滾動出現的字幕，按鈕等內容。滾動字幕的應用會使網頁的內容更加生動緊湊。ide

一、滾動標籤<marquee></marquee>oop

將滾動顯示的文字放在這個標籤內，就能夠實現滾動字幕。這個標籤有一個behavior屬性，能夠設置滾動方式：this

scroll：循環滾動，默認的滾動方式spa

slide：只滾動一次code

alternate：左右來回滾動圖片

二、設置字幕背景顏色io

<body>
<marquee behavior="alternate" bgcolor="#F4070B">這裏是滾動字幕</marquee>
</body>

三、設置字幕滾動方向：direction屬性，能夠設置的值有：left，right，up，down。分別表示從右向左滾動，從左向右滾動，從下向上滾動，從上向下滾動。循環

四、設置字幕的滾動速度scroll

經過設置scrollamount屬性來更改字幕的滾動速度，數值越大，速度越快。gc

五、設置字幕滾動時間間隔

scrolldelay能夠來設置字幕的停頓時間間隔，單位是毫秒。效果和速度屬性類似。

六、設置滾動次數

loop屬性能夠設置滾動次數，-1則爲循環滾動。

七、設置鼠標滑過期中止滾動，移開時繼續滾動：

<body>
<marquee direction="down" onMouseOver="this.stop()" onMouseOut="this.start()">這裏是滾動字幕</marquee>
</body>

滾動字幕也支持圖片的滾動，將文字換位圖片便可。

專一技術，熱愛生活，交流技術，也作朋友。

——琿少 QQ羣：203317592

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。