javascript 打字效果的文字特效
更新時(shí)間：2011年01月19日 19:05:21 作者：
文字如何實(shí)現(xiàn)打字的效果呢?在瀏覽網(wǎng)頁(yè)的時(shí)候也經(jīng)常能看到這種效果。本節(jié)給出了一個(gè)打字效果的文字特效，文字一個(gè)一個(gè)地打印在頁(yè)面上。
本節(jié)代碼主要使用了 onMousedown 事件和 event.button 屬性，主要功能和用法如下。
• setTimeout 方法，在執(zhí)行時(shí)是在載入后延遲指定時(shí)間后，去執(zhí)行一次表達(dá)式，僅執(zhí)行一次。
• charAt 方法返回一個(gè)字符值，該字符位于指定索引位置。字符串中的第一個(gè)字符的索引為0，第二個(gè)的索引為1，等等。超出有效范圍的索引值返回空字符串。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
運(yùn)行該程序后，頁(yè)面出現(xiàn)一個(gè)提示信息，然后逐個(gè)出現(xiàn)字符。如此逐個(gè)出現(xiàn)字符后，等待全部打印完畢即可停止打印。
源程序解讀
（1）程序首先建立了一個(gè)層，其 ID 為 ttl0，便于以后調(diào)用。這個(gè)層用來顯示打印的文字。
（2）程序在<body>元素上添加 onLoad 事件，當(dāng)整個(gè)頁(yè)面載入完成以后，該事件被觸發(fā)，調(diào)用 init() 事件處理函數(shù)，對(duì)該事件進(jìn)行處理。
?。?）在函數(shù) txtTyper() 中，使用 charAt 方法得到字符串中的某個(gè)字符。使用 if 條件語句判斷該字符是否滿足盡頭。滿足條件后打印在頁(yè)面上。
?。?）在 if 語句中，也可使用任意合法的 JavaScript 語句，完成更為復(fù)雜的操作。
• setTimeout 方法，在執(zhí)行時(shí)是在載入后延遲指定時(shí)間后，去執(zhí)行一次表達(dá)式，僅執(zhí)行一次。
• charAt 方法返回一個(gè)字符值，該字符位于指定索引位置。字符串中的第一個(gè)字符的索引為0，第二個(gè)的索引為1，等等。超出有效范圍的索引值返回空字符串。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
運(yùn)行該程序后，頁(yè)面出現(xiàn)一個(gè)提示信息，然后逐個(gè)出現(xiàn)字符。如此逐個(gè)出現(xiàn)字符后，等待全部打印完畢即可停止打印。
源程序解讀
（1）程序首先建立了一個(gè)層，其 ID 為 ttl0，便于以后調(diào)用。這個(gè)層用來顯示打印的文字。
（2）程序在<body>元素上添加 onLoad 事件，當(dāng)整個(gè)頁(yè)面載入完成以后，該事件被觸發(fā)，調(diào)用 init() 事件處理函數(shù)，對(duì)該事件進(jìn)行處理。
?。?）在函數(shù) txtTyper() 中，使用 charAt 方法得到字符串中的某個(gè)字符。使用 if 條件語句判斷該字符是否滿足盡頭。滿足條件后打印在頁(yè)面上。
?。?）在 if 語句中，也可使用任意合法的 JavaScript 語句，完成更為復(fù)雜的操作。
相關(guān)文章
基于JavaScript的平滑文字閃爍,不是單純的閃爍,貌似還帶有一點(diǎn)點(diǎn)別的效果,比如淡入/淡出,那些顏色值你是可以變的,改成你想要的,還有閃爍間隔等,都可以修改的.2009-10-10
JavaScript形成溶解過渡形式的文字切換特效，夠酷吧，的你平靜如水的網(wǎng)頁(yè)上旋轉(zhuǎn)這么一個(gè)文字特效，一定會(huì)吸引不少人的注意力，文字內(nèi)容和顏色以及字號(hào)大小看看代碼就會(huì)知道怎么改了。2009-11-11
JavaScript點(diǎn)擊插入文字，在一段文字的任意處點(diǎn)擊，會(huì)將你時(shí)先準(zhǔn)備好的文字插入到一段文字中，可能大家不怎么用到，不過感覺很奧妙，希望高手改進(jìn)成自己想要的效果。2009-10-10
JavaScript實(shí)現(xiàn)雪花飄落效果特效
雪，是冬天的靈魂，為大地鋪好背景，之后發(fā)生的都如夢(mèng)似幻，就像童話般的存在。冬天沒有雪，能難倒程序猿嗎，沒有雪自己造，這篇文章主要介紹了JavaScript實(shí)現(xiàn)雪花飄落效果特效,需要的朋友可以參考下2023-01-01
CSS3實(shí)現(xiàn)3D文字動(dòng)畫效果
CSS3 3D文字動(dòng)畫，看到這個(gè)字眼都覺得震撼，順便兼用下另兩個(gè)屬性：transition 和 animation。由于使用CSS3技術(shù)，因此測(cè)試時(shí)請(qǐng)使用火狐或Chrome等瀏覽器，否則不能看到效果2012-12-12
CSS做出漂亮的鼠標(biāo)懸停提示效果，使用層的絕對(duì)定位，不管你的網(wǎng)頁(yè)窗口如何變化，提示層始終處于理想位置不會(huì)改變，兼容性也良好，因些很實(shí)用的一個(gè)鏈接提示功能代碼。2009-10-10
Js+CSS實(shí)現(xiàn)的間斷和不間斷文本滾動(dòng)代碼
Js+CSS間斷和不間斷文本滾動(dòng)代碼，文字在一行高度范圍內(nèi)不間斷滾動(dòng)，還有一個(gè)是間斷滾動(dòng)，滾動(dòng)一次后會(huì)稍停片刻再次滾動(dòng)。2010-10-10
用VBScript捕捉鼠標(biāo)的移動(dòng)，然后令光線射向也隨著移動(dòng)，這樣就形成了鼠標(biāo)像光源的效果。2009-10-10
javascript 網(wǎng)頁(yè)上跳動(dòng)的文字
網(wǎng)頁(yè)上跳動(dòng)的文字，代碼稍復(fù)雜，效果挺可愛的，一跳一跳的文字，真逗人！2009-10-10
JavaScript數(shù)組應(yīng)用 可依次讀取的公告欄文字
一個(gè)JavaScript數(shù)組的應(yīng)用例子，我們將文字存儲(chǔ)于數(shù)組中，然后用循環(huán)依次輸出這些文字，像一條一條的公告一樣，不過現(xiàn)在都不這么用了，可以學(xué)習(xí)JS數(shù)組，算是一個(gè)實(shí)例參考。2009-10-10