如何实现文章中文字的打字效果
生活随笔
收集整理的這篇文章主要介紹了
如何实现文章中文字的打字效果
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
如何實(shí)現(xiàn)文章中文字的打字效果的問(wèn)題，其實(shí)，這個(gè)效果是用JavaScript來(lái)實(shí)現(xiàn)的，由于大多數(shù)博友網(wǎng)頁(yè)知識(shí)不多，所以我就不深入講解了。只要你按照本文的方法去做，保證你的文章實(shí)現(xiàn)打字效果！ 第一步：首先在你的電腦桌面上點(diǎn)擊鼠標(biāo)右鍵--新建--文本文檔，然后把下面代碼復(fù)制進(jìn)去，再把里面的文字修改成你自己想要的文字！ 代碼： <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0035)[url]http://www.bohope.com/myfriends.htm[/url] -->
<HTML><HEAD><TITLE>這里是網(wǎng)頁(yè)的標(biāo)題文字</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312"><LINK
type=text/css rel=stylesheet>
<STYLE type=text/css>TD {
?FONT-SIZE: 14px; LINE-HEIGHT: 28px
}
</STYLE>
<BGSOUND src="這是背景音樂(lè)網(wǎng)址" loop=infinite>
<META content="MSHTML 6.00.2900.2912" name=GENERATOR></HEAD>
<BODY bgColor=#003366 leftMargin=38
background=這是背景圖片網(wǎng)址>
<SCRIPT language=VBScript>
dim w,t,p,mm,c,mr,dy,tmp,vs:vs=5:dy=1:p=1:mr="<BR><BR><BR>":c="<font color=white><B>|"&mr:Set w = document.body sub tp
?m=mid(t,p,1):if m="" then c=mr
?if m="`" then m="":mm=mid(mm,1,len(mm)-1)
?if m="<" then av=instr(mid(t,p),">"):m=mid(t,p,av):p=p+av-1
?if m="&" then av=instr(mid(t,p),";"):m=mid(t,p,av):p=p+av-1
?tmp=100:if m="." then tmp=400 else if m="," then tmp=200 else if m=" " then tmp=200
?if w.scrollHeight-w.scrollTop>w.offsetHeight then w.scrollTop=w.scrollTop+int(dy):dy=dy+dy/vs else dy=1
?mm=mm&m:w1.innerHTML=mm&c:p=p+1:if p<=len(t)+1 then SetTimeOut "tp",16+tmp else w.scroll="yes"
end sub sub window_onload()
?w.scroll="yes"
?w.bgcolor="#A8A8A8"
?w.style.cursor="crosshair"
?'-------------------
?t=w0.innerHTML:tp
end sub
</SCRIPT> <DIV id=w0 style="DISPLAY: none; WIDTH: 400px; HEIGHT: 1263px">
<DIV align=center>
<CENTER>
<TABLE height=80 width=400 border=0>
? <TBODY>
? <TR>
??? <TD align=left width=5 height=80></TD>
??? <TD align=middle width=390 height=80><B><FONT face=華文行楷 color=#ff0000
????? size=5>這是文章題目</FONT></B></TD>
??? <TD align=right width=5 height=80></TD></TR></TBODY></TABLE></CENTER></DIV>
<TABLE width=400 align=center border=0>
? <TBODY>
? <TR>
??? <TD>
????? <P><B><FONT color=#00ff00 size=4>這是文章副標(biāo)題或者備注</FONT></B></P>
?<HR width="100%" SIZE=1>
????? <P><FONT? color=#ffffff size=3>這里是正文第一段文字</FONT></P>
????? <P><FONT color=#ffffff size=3>這里是正文第二段文字</FONT></P>
????? <P><FONT color=#ffffff size=3>大家可以接著寫(xiě)下面的文字</FONT></P>
</TD></TR></TBODY></TABLE></DIV>
<DIV id=w1 style="WIDTH: 400px; HEIGHT: 16px" align=center></DIV>
<DIV align=left>
<TABLE cellSpacing=0 cellPadding=0 width=400px; border=0;align=left>
? <TBODY>
? <TR>
??? <TD align=left><img src="插入的圖片網(wǎng)址"? height="100"> </P>
<BR><BR>
<DIV style="DISPLAY: none" align=center></DIV></TD></TR></TBODY></TABLE> </DIV><P></P></BODY></HTML>
代碼說(shuō)明：如果你不想插入背景音樂(lè)，可以直接刪除“背景音樂(lè)網(wǎng)址”的文字；另外將代碼中相應(yīng)的文字改成自己需要的文字即可，其中正文的文字需要一段一段的輸入，所以大家最好首先在一個(gè)記事本文檔里面編輯好文字，然后一段一段的粘貼進(jìn)去即可。〕 其中代碼中的藍(lán)色部分，是大家自由發(fā)揮的空間，你可以只插入一張圖片，當(dāng)然也可以像我那樣插入滾動(dòng)圖片，還可以插入透明Flash等等，只要你能夠靈活運(yùn)用本博其他文章中的代碼，加以適當(dāng)?shù)慕M合，就會(huì)做出千變?nèi)f化的效果！這里在下就不多說(shuō)了。 第二步：將設(shè)置好的文件保存，然后重命名為網(wǎng)頁(yè)形式，例如“file.htm”，這時(shí)候電腦必定會(huì)彈出一個(gè)對(duì)話框，選擇“是”。 第三步：找一個(gè)免費(fèi)空間上傳你設(shè)置好的網(wǎng)頁(yè)，在下推薦：[url]http://home.139.com[/url] 將你上傳的文件網(wǎng)址復(fù)制到以下的代碼中，然后將代碼添加到你的文章“顯示源代碼”里就可以了。代碼如下：
<IFRAME style="WIDTH: 100%; HEIGHT: 500px" marginWidth=0 marginHeight=0 src="你的文件網(wǎng)址" frameBorder=0 width="100%" scrolling=no height=500></IFRAME> 代碼說(shuō)明：其中的HEIGHT: 500px表示界面的高度，你可以根據(jù)自己的需要設(shè)置，建議不要超過(guò)600。
<!-- saved from url=(0035)[url]http://www.bohope.com/myfriends.htm[/url] -->
<HTML><HEAD><TITLE>這里是網(wǎng)頁(yè)的標(biāo)題文字</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312"><LINK
type=text/css rel=stylesheet>
<STYLE type=text/css>TD {
?FONT-SIZE: 14px; LINE-HEIGHT: 28px
}
</STYLE>
<BGSOUND src="這是背景音樂(lè)網(wǎng)址" loop=infinite>
<META content="MSHTML 6.00.2900.2912" name=GENERATOR></HEAD>
<BODY bgColor=#003366 leftMargin=38
background=這是背景圖片網(wǎng)址>
<SCRIPT language=VBScript>
dim w,t,p,mm,c,mr,dy,tmp,vs:vs=5:dy=1:p=1:mr="<BR><BR><BR>":c="<font color=white><B>|"&mr:Set w = document.body sub tp
?m=mid(t,p,1):if m="" then c=mr
?if m="`" then m="":mm=mid(mm,1,len(mm)-1)
?if m="<" then av=instr(mid(t,p),">"):m=mid(t,p,av):p=p+av-1
?if m="&" then av=instr(mid(t,p),";"):m=mid(t,p,av):p=p+av-1
?tmp=100:if m="." then tmp=400 else if m="," then tmp=200 else if m=" " then tmp=200
?if w.scrollHeight-w.scrollTop>w.offsetHeight then w.scrollTop=w.scrollTop+int(dy):dy=dy+dy/vs else dy=1
?mm=mm&m:w1.innerHTML=mm&c:p=p+1:if p<=len(t)+1 then SetTimeOut "tp",16+tmp else w.scroll="yes"
end sub sub window_onload()
?w.scroll="yes"
?w.bgcolor="#A8A8A8"
?w.style.cursor="crosshair"
?'-------------------
?t=w0.innerHTML:tp
end sub
</SCRIPT> <DIV id=w0 style="DISPLAY: none; WIDTH: 400px; HEIGHT: 1263px">
<DIV align=center>
<CENTER>
<TABLE height=80 width=400 border=0>
? <TBODY>
? <TR>
??? <TD align=left width=5 height=80></TD>
??? <TD align=middle width=390 height=80><B><FONT face=華文行楷 color=#ff0000
????? size=5>這是文章題目</FONT></B></TD>
??? <TD align=right width=5 height=80></TD></TR></TBODY></TABLE></CENTER></DIV>
<TABLE width=400 align=center border=0>
? <TBODY>
? <TR>
??? <TD>
????? <P><B><FONT color=#00ff00 size=4>這是文章副標(biāo)題或者備注</FONT></B></P>
?<HR width="100%" SIZE=1>
????? <P><FONT? color=#ffffff size=3>這里是正文第一段文字</FONT></P>
????? <P><FONT color=#ffffff size=3>這里是正文第二段文字</FONT></P>
????? <P><FONT color=#ffffff size=3>大家可以接著寫(xiě)下面的文字</FONT></P>
</TD></TR></TBODY></TABLE></DIV>
<DIV id=w1 style="WIDTH: 400px; HEIGHT: 16px" align=center></DIV>
<DIV align=left>
<TABLE cellSpacing=0 cellPadding=0 width=400px; border=0;align=left>
? <TBODY>
? <TR>
??? <TD align=left><img src="插入的圖片網(wǎng)址"? height="100"> </P>
<BR><BR>
<DIV style="DISPLAY: none" align=center></DIV></TD></TR></TBODY></TABLE> </DIV><P></P></BODY></HTML>
代碼說(shuō)明：如果你不想插入背景音樂(lè)，可以直接刪除“背景音樂(lè)網(wǎng)址”的文字；另外將代碼中相應(yīng)的文字改成自己需要的文字即可，其中正文的文字需要一段一段的輸入，所以大家最好首先在一個(gè)記事本文檔里面編輯好文字，然后一段一段的粘貼進(jìn)去即可。〕 其中代碼中的藍(lán)色部分，是大家自由發(fā)揮的空間，你可以只插入一張圖片，當(dāng)然也可以像我那樣插入滾動(dòng)圖片，還可以插入透明Flash等等，只要你能夠靈活運(yùn)用本博其他文章中的代碼，加以適當(dāng)?shù)慕M合，就會(huì)做出千變?nèi)f化的效果！這里在下就不多說(shuō)了。 第二步：將設(shè)置好的文件保存，然后重命名為網(wǎng)頁(yè)形式，例如“file.htm”，這時(shí)候電腦必定會(huì)彈出一個(gè)對(duì)話框，選擇“是”。 第三步：找一個(gè)免費(fèi)空間上傳你設(shè)置好的網(wǎng)頁(yè)，在下推薦：[url]http://home.139.com[/url] 將你上傳的文件網(wǎng)址復(fù)制到以下的代碼中，然后將代碼添加到你的文章“顯示源代碼”里就可以了。代碼如下：
<IFRAME style="WIDTH: 100%; HEIGHT: 500px" marginWidth=0 marginHeight=0 src="你的文件網(wǎng)址" frameBorder=0 width="100%" scrolling=no height=500></IFRAME> 代碼說(shuō)明：其中的HEIGHT: 500px表示界面的高度，你可以根據(jù)自己的需要設(shè)置，建議不要超過(guò)600。
轉(zhuǎn)載于:https://blog.51cto.com/blacksnow/80637
總結(jié)
以上是生活随笔為你收集整理的如何实现文章中文字的打字效果的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： PHP实现常见排序
- 下一篇： 组图：2000悉尼奥运会