本文實例為大家分享了jQuery實現(xiàn)文字打印動態(tài)效果的具體代碼，供大家參考，具體內(nèi)容如下

主體html

打印文字效果

The furthest distance in the world.Is not between life and death.But when I stand in front of you.Yet you don't know that I love you

對于JQuery的引用,可以先到JQuery官網(wǎng)下載相應(yīng)的版本,引用的時候加入相應(yīng)的目錄就可以了

接下來就是在script標(biāo)簽中添加代碼實現(xiàn)文字的動態(tài)效果了,先上代碼

$(dcument).ready(function(){

typing();

})

var text;//p標(biāo)簽里對應(yīng)的字符串

var index = 0;//text字符串的下標(biāo)

var id;//setTimeout()的返回值,用于關(guān)閉clearTimeout(id)

function typing()

{

text = $("#typing").text();

$("#typing").text("");

$("#typing").show();

typed();

}

result = "";

function typed(){

result += text.charAt(index);

$("#typing").text(result + (index & 1 ? "_" : " "));

if(index

{

index++;

id = setTimeout("typed()", 100);

}

else

clearTimeout(id);

}

為什么顯示文字的時候是result+ (index & 1 ? "_" : " ")呢,當(dāng)然是為了打印的動態(tài)效果了,當(dāng)下標(biāo)index為奇數(shù)的時候最后一個字符顯示為"_",當(dāng)為偶數(shù)的時候顯示" ",這樣就能形成打印文字的那種動態(tài)效果。

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

總結(jié)

以上是生活随笔為你收集整理的html字体打印效果,基于jQuery实现文字打印动态效果的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。