在自制主頁(yè)中實(shí)現(xiàn)游走字幕

2019-11-18 15:22:49

字體：大中小

供稿：網(wǎng)友

　　一個(gè)獨(dú)具特色的主頁(yè)將會(huì)在WWW海洋之中更加突出你的個(gè)性。應(yīng)該說(shuō)，在主頁(yè)狀態(tài)行中實(shí)現(xiàn)游走字幕只是一個(gè)非常小的應(yīng)用，但javascript強(qiáng)大的主頁(yè)創(chuàng)作能力，或許會(huì)給你一些其他方面的啟迪。

隨著Internet的普及與發(fā)展，越來(lái)越多的人開(kāi)始嘗試自己制作主頁(yè)。在瀏覽別人主頁(yè)時(shí)，我們經(jīng)常看到那些需要非凡強(qiáng)調(diào)、提醒的文本，通常都是做成游走字幕的形式。能不能在我們自己編制的主頁(yè)中加上這些效果呢？本文將介紹其實(shí)現(xiàn)方法。
一、了解Javascript語(yǔ)言
JavaScript是Netscape公司為了擴(kuò)展NetscapeNavigator的功能而開(kāi)發(fā)的一種緊湊的、基于對(duì)象的描述語(yǔ)言，通常用來(lái)開(kāi)發(fā)客戶機(jī)或服務(wù)器端的Internet應(yīng)用程序。JavaScript主要用于識(shí)別和響應(yīng)某些用戶事件，如頁(yè)面瀏覽、文本輸入、鼠標(biāo)點(diǎn)擊等，它能不經(jīng)網(wǎng)絡(luò)傳輸直接對(duì)上述事件進(jìn)行回應(yīng)。與Java相比，JavaScript小巧、靈活、輕易理解和使用；不需要聲明變量類型；沒(méi)有Java的類和繼續(xù)的概念；更不需要象Java那樣在客戶機(jī)上運(yùn)行前必須在服務(wù)器端進(jìn)行編譯。NetscapeNavigator2．0以上的瀏覽器都能解釋執(zhí)行那些直接嵌入在Html文檔內(nèi)的JavaScript語(yǔ)句。
二、把握setTimeout（）函數(shù)
JavaScript提供了一個(gè)很有用的函數(shù)setTimeout（），它能在設(shè)定的時(shí)間之后，對(duì)某一事件作出反應(yīng)。相當(dāng)于其他高級(jí)語(yǔ)言中的定時(shí)器。
調(diào)用格式：
timeoutIDΚsetTimeout（eXPRession，msec）
參數(shù)說(shuō)明：
timeoutID：一個(gè)僅供clearTimeout（）終止事件用的標(biāo)識(shí)
expression：字符表達(dá)式即對(duì)象屬性
msec：毫秒數(shù)，表示多少毫秒以后事件動(dòng)作
為了具體說(shuō)明JavaScript的編程方法及setTimeout（）函數(shù)的使用，讓我們先來(lái)看一個(gè)小程序。
ΙhtmlΛ／／超文本文件開(kāi)始
ΙheadΛ／／超文本文件頭開(kāi)始
ΙtitleΛ時(shí)鐘小程序Ι／titleΛ／／超文本標(biāo)題
ΙscriptlanguageΚ″JavaScript″Λ／／JavaScript開(kāi)始
Ι！－－／／注釋標(biāo)志
vartimerIDΚnull
vartimerRunningΚfalse
／／終止setTimeout（）定義的事件
functionstopclock（）｛
if（timerRunning）
clearTimeout（timerID）
timerRunningΚfalse
｝
／／調(diào)用子過(guò)程
functionstartclock（）｛
／／Makesuretheclockisstopped
stopclock（）
showtime（）
｝
／／取出機(jī)器時(shí)間，并每秒鐘顯示一次
functionshowtime（）｛
varnowΚnewDate（）
varhoursΚnow．getHours（）
varminutesΚnow．getMinutes（）
varsecondsΚnow．getSeconds（）
vartimeValueΚ″″＋（（hoursΛ12）？hours－12：hours）／／24小時(shí)制轉(zhuǎn)化為12小時(shí)制
timeValue＋Κ（（minutesΙ10）？″：0″：″：″）＋minutes／／小于10分時(shí)前面加“0”
timeValue＋Κ（（secondsΙ10）？″：0″：″：″）＋seconds／／小于10秒時(shí)前面加“0”
timeValue＋Κ（hoursΛΚ12）？″P．M．″：″A．M．″／／判定上、下午
document．clock．face．valueΚtimeValue／／命名
timerIDΚsetTimeout（″showtime（）″，1000）
／／每1000毫秒即1秒執(zhí)行一次
timerRunningΚtrue
｝
／／－－Λ／／注釋標(biāo)志
Ι／scriptΛ／／JavaScript結(jié)束
Ι／headΛ／／超文本文件頭結(jié)束
／／裝入startclock（）函數(shù)
ΙbodyonLoadΚ″startclock（）″Λ／／超文本正文主體開(kāi)始
／／在主頁(yè)上創(chuàng)建一個(gè)用于顯示時(shí)間的窗口
ΙformnameΚ″clock″onSubmitΚ″0″Λ／／交互項(xiàng)元素開(kāi)始
ΙinputtypeΚ″text″nameΚ″face″sizeΚ22valueΚ″″Λ／／定義一個(gè)輸入信息元素
Ι／formΛ／／交互項(xiàng)元素結(jié)束
Ι／bodyΛ／／超文本正文主體結(jié)束
Ι／htmlΛ／／超文本文件結(jié)束
上例中整個(gè)HTML文件都用ΙhtmlΛ和Ι／htmlΛ括起來(lái)，JavaScript語(yǔ)句用ΙscriptΛ和Ι／scriptΛ括起來(lái)，它可以放在HTML文件中的任何地方，通常和窗口標(biāo)題的起止標(biāo)簽ΙtitleΛΙ／titleΛ一起放在文件頭的起止標(biāo)簽ΙheadΛΙ／headΛ內(nèi)，由文件主體起止標(biāo)簽ΙbodyΛΙ／bodyΛ中的語(yǔ)句調(diào)用。JavaScript的語(yǔ)法說(shuō)明部分用HTML的注釋符號(hào)Ι！－－和－－Λ括了起來(lái)，以避免不支持JavaScript的瀏覽器產(chǎn)生錯(cuò)誤。注釋的順序?yàn)椋合圈﹕criptΛ，接著是注釋的開(kāi)頭Ι！－－，然后是內(nèi)容，再后是注釋尾－－Λ，最后是Ι／scriptΛ。另外，JavaScript本身也可以注釋，和c＋＋與Java一樣，它的注釋行符號(hào)為／／，如本例所示。JavaScript中很多語(yǔ)法都和C相似，上述程序?qū)τ谏杂悬c(diǎn)C基礎(chǔ)的朋友一定不難理解。
三、實(shí)現(xiàn)游走字幕
在JavaScript中用window．status來(lái)控制狀態(tài)行輸出，假如能在程序的控制下，對(duì)狀態(tài)行進(jìn)行定時(shí)刷新，即可實(shí)現(xiàn)游走字幕的效果。所以，本程序?qū)嶋H上分兩部分：動(dòng)態(tài)生成字符串；定時(shí)重寫狀態(tài)行。本程序中所用的方法是：先在字幕內(nèi)容前加上大于狀態(tài)行長(zhǎng)度的空格，循環(huán)遞減空格并定時(shí)顯示，即實(shí)現(xiàn)游走效果；當(dāng)字幕運(yùn)動(dòng)到狀態(tài)行最左端時(shí)，循環(huán)截取后面未顯示的字幕內(nèi)容，定時(shí)刷新；循環(huán)結(jié)束后，置空狀態(tài)行，并設(shè)置下次循環(huán)初值。程序代碼如下：
ΙHTMLΛ
ΙHEADΛ
ΙSCRIPTlanguageΚ″JavaScript″Λ
Ι！－－BeginningofWebMania／JavaScriptApplet－－－－－－－－－－－－－－－－－－－
／＊Copyright（C）1996HeYuHai＆PangGuSong
AllRightsReserved．
＊／
functionscroll?status（seed）
｛
varmsgΚ″歡迎訪問(wèn)何雨海個(gè)人主頁(yè)″；
／／漢字之間空一格是為了使字幕運(yùn)動(dòng)到狀態(tài)行的最左端時(shí)不至于出現(xiàn)亂字符
varoutΚ″″；
varcΚ1；
／／seed值大于150時(shí)，空循環(huán)。因?yàn)闋顟B(tài)行的長(zhǎng)度都小于150
if（150Ιseed）｛
seed－－；
varcmdΚ″scroll?status（″＋seed＋″）″；
timerTwoΚwindow．setTimeout（cmd，100）；
｝
／／字幕內(nèi)容前的空格循環(huán)遞減，并定時(shí)顯示，實(shí)現(xiàn)字幕游走
elseif（seedΙΚ150＆＆0Ιseed）｛
for（cΚ0；cΙseed；c＋＋）｛
out＋Κ″″；
｝
out＋Κmsg；／／循環(huán)賦值
seed－－；／／遞減
varcmdΚ″scroll?status（″＋seed＋″）″；
window．statusΚout；／／重寫狀態(tài)行
timerTwoΚwindow．setTimeout（cmd，100）；／／定時(shí)0．1秒
｝
elseif（seedΙΚ0）｛
／／當(dāng)字模游走到狀態(tài)行最左端時(shí)，循環(huán)截取未顯示的部分，繼續(xù)游走顯示
if（－seedΙmsg．length）｛
out＋Κmsg．substring（－seed，msg．length）；
seed－－；
varcmdΚ″scroll?status（″＋seed＋″）″；
window．statusΚout；
timerTwoΚwindow．setTimeout（cmd，100）；
｝
else｛
window．statusΚ″″；／／循環(huán)結(jié)束，置空狀態(tài)行
timerTwoΚwindow．setTimeout（″scroll?status（150）″，100）；／／設(shè)置下次循環(huán)初值
｝
｝
｝
／／－－EndofJavaScriptcode－－－－－－－－－Λ／／結(jié)束JavaScript調(diào)用
Ι／SCRIPTΛ
Ι／HEADΛ
ΙBODYonloadΚ″timerONEΚwindow．setTimeout（′scroll?status（100）′，50）；″Λ／／seed要大于狀態(tài)行的長(zhǎng)度，否則第一次顯示時(shí)，不是從最左端而是從狀態(tài)行左邊第seed個(gè)字符處開(kāi)始顯示
．
．
．
Ι／BODYΛ
Ι／HTMLΛ
JavaScript是自己編制主頁(yè)不可缺少的、最理想的一種腳本語(yǔ)言，愿本文能拋磚引玉，啟發(fā)您更美妙的構(gòu)思。

--------------------------------------------------------------------------------

報(bào)刊名稱：中國(guó)計(jì)算機(jī)報(bào)
期號(hào)：667
版名：編程維修
欄目：編程與維修
標(biāo)題：在自制主頁(yè)中實(shí)現(xiàn)游走字幕
副標(biāo)題：
作者：
日期：1997-07-21

上一篇：怎樣使用網(wǎng)頁(yè)JS提交發(fā)信給我？

下一篇：在組件上顯示圖象