JS代碼實現(xiàn)狀態(tài)欄文字來回顯示

2012/10/27 11:54:16作者：佚名來源：網(wǎng)絡(luò)

移動端

【實例名稱】

【實例描述】

網(wǎng)頁經(jīng)常使用狀態(tài)欄來提示信息，本例用兩個簡單的JavaScript方法，實現(xiàn)文字來回顯示的效果。

【實例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標(biāo)題頁-學(xué)無憂（wangbatian.cn）</title>
<SCRIPT LANGUAGE="JavaScript">
var Message="歡迎購買JavaScript實例大全，希望您能繼續(xù)支持！";
var place=1;
//文字顯示的方法
function scrollIn() 
{
//從第一個文字開始在狀態(tài)欄顯示
window.status=Message.substring(0, place);
if (place >= Message.length) {
  place=1;
window.setTimeout("scrollOut()",300); //間隔300毫秒，循環(huán)收回文字
} else {
  place++;
window.setTimeout("scrollIn()",50);  //間隔50毫秒，循環(huán)顯示文字
   } 
}
//文字收回的方法
function scrollOut() 
{
window.status=Message.substring(place, Message.length);
if (place >= Message.length) {
   place=1;
window.setTimeout("scrollIn()", 100);//間隔100毫秒，循環(huán)顯示文字
} else {
   place++;
window.setTimeout("scrollOut()", 50);//間隔50毫秒，循環(huán)收回文字
   }
}
</SCRIPT>
</head>
<body bgcolor="#eaf4d9" onLoad="scrollIn()">
</body>
</html>
【運行效果】

運行效果

【難點剖析】

本例的重點是“scrollln”和“scrollOut”兩個方法?！皊crollIn”用來顯示文本，當(dāng)文本顯示完畢后．調(diào)用“scrollOut”隱藏文本。程序依次循環(huán)調(diào)用“scrollIn”和“scr。llOut”，實現(xiàn)文本來回顯示的效果。

【源碼下載】

如果你不愿復(fù)制代碼及提高代碼準(zhǔn)確性，你可以點擊：JS代碼實現(xiàn)狀態(tài)欄文字來回顯示進行本實例源碼下載

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