網(wǎng)頁特效代碼模板無憂>網(wǎng)頁特效>文本鏈接特效代碼>

類似打字效果的文字特效_文本鏈接特效

類似電腦打字效果的文字切換代碼，每次顯示一行文字，很常見的一個JS小技巧，你可以把這段JS另存為一個新文件，在需要顯示的地方嵌入即可，比如在一個表格內(nèi)就可以。

<html>
<head>
<title>文字打字效果</title>
</head>
<body>
<script language="JavaScript1.2">
<!--
var line=new Array()
line[1]="當(dāng)我孤獨的時候......"
line[2]="還可以抱著你......"
line[3]="那該有多幸福......"
var ts_fontsize="16px"
var longestmessage=1
for (i=2;i<line.length;i++){
if (line[i].length>line[longestmessage].length)
longestmessage=i
}

///
var tscroller_width=line[longestmessage].length

lines=line.length-1 //--Number of lines

//if IE 4+ or NS6
if (document.all||document.getElementById){
document.write('<form name="bannerform">')
document.write('<input type="text" name="banner" size="'+tscroller_width+'"')
////
document.write('  style="background-color: '+document.bgColor+'; color: '+document.body.text+'; font-family: verdana; font-size: '+ts_fontsize+'; font-weight:bold; border: medium none" onfocus="blur()">')
document.write('</form>')
}

temp=""
nextchar=-1;
nextline=1;
cursor="\\"
function animate(){
if (temp==line[nextline] & temp.length==line[nextline].length & nextline!=lines){
nextline++;
nextchar=-1;
document.bannerform.banner.value=temp;
temp="";
setTimeout("nextstep()",1000)}
else if (nextline==lines & temp==line[nextline] & temp.length==line[nextline].length){
nextline=1;
nextchar=-1;
document.bannerform.banner.value=temp;
temp="";
setTimeout("nextstep()",1000)}
else{
nextstep()}}

function nextstep(){

if (cursor=="\\"){
cursor="|"}
else if (cursor=="|"){
cursor="/"}
else if (cursor=="/"){
cursor="-"}
else if (cursor=="-"){
cursor="\\"}
nextchar++;
temp+=line[nextline].charAt(nextchar);
document.bannerform.banner.value=temp+cursor
setTimeout("animate()",25)}

//if IE 4+ or NS6
if (document.all||document.getElementById)
window.onload=animate
// -->
</script>
</body>
<html>

所屬頻道：文本鏈接特效/更新時間：2012-12-17

[收藏][報錯][返回列表]

相關(guān)文本鏈接特效：

類似打字效果的文字特效_文本鏈接特效

文本鏈接特效Rss訂閱特效代碼搜索

文本鏈接特效推薦

猜你也喜歡看這些