當(dāng)前位置：軟件學(xué)堂 > 資訊首頁(yè) > 網(wǎng)絡(luò)編程 > 編程其他 > JS代碼實(shí)現(xiàn)狀態(tài)欄跑馬燈效果

JS代碼實(shí)現(xiàn)狀態(tài)欄跑馬燈效果

2012/10/26 17:51:33作者：佚名來源：網(wǎng)絡(luò)

移動(dòng)端

【實(shí)例名稱】

JS代碼實(shí)現(xiàn)狀態(tài)欄跑馬燈效果

【實(shí)例描述】

跑馬燈效果一般指文本的逐字滾動(dòng)或逐字顯示。本例學(xué)習(xí)如何在狀態(tài)欄顯示文本．并實(shí)現(xiàn)文本的跑馬燈效果。

【實(shí)例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>標(biāo)題頁(yè)-學(xué)無憂（wangbatian.cn）</title>
<SCRIPT Language="JavaScript">
var msg="歡迎光臨北京紅十字會(huì)，期待志愿者的參與!";
var interval = 400;
seq = 0;
function marquee() 
{
len = msg.length;
window.status = msg.substring(0, seq+1); 
 //逐字增加文本
seq++;
if ( seq >= len ) { seq = 0 };   
//如果文本已經(jīng)顯示完，則從頭開始
window.setTimeout("marquee();", interval);
} 
</SCRIPT>
</head>
<body  onload="marquee()">
</body>
</html>

【運(yùn)行效果】

運(yùn)行效果

【難點(diǎn)剖析】

本例的重點(diǎn)有兩個(gè)：在狀態(tài)欄顯示文字、以跑馬燈效果顯示文字。在狀態(tài)欄顯示文字用“window．status”，而跑馬燈效果是借助“substring”方法，根據(jù)定時(shí)器的時(shí)間逐字顯示文本。

【源碼下載】

本實(shí)例JS代碼下載

 

標(biāo)簽： JS代碼  狀態(tài)欄