打字机式字符输出

像打字机一样输出自己的内容,内容可以自己修改。在内容区可自己定义字号、字体样式、字体颜色等,打字的速度也是可以调节的,在JavaScript代码段部分。本效果用于网站公告挺好,在网页的顶部留一行的空间,用打字效果输出你的公告信息,因为文字写在HTML网页的JS内,因此搜索引擎也是可以抓到的。 



<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>JS打字机风格的字符输出特效</title>

<SCRIPT language="JavaScript">

<!--

var layers = document.layers, style = document.all, both = layers || style, idme=908601;

if (layers) { layerRef = 'document.layers'; styleRef = ''; } if (style) { layerRef = 'document.all'; styleRef = '.style'; }

function writeOnText(obj, str) {

 if (layers) with (document[obj]) { document.open();  document.write(str); document.close(); }

 if (style) eval(obj+'.innerHTML= str');

}

//以下是输出的内容,自己修改即可。

var dispStr = new Array(

"<font color=red size=3>欢迎来到源码爱好者...</font><br><font color=green size=3>她为我们提供各类编程源码、素材、书籍教程、设计模板、网页特效代码以及常用软件下载。</font><br><font color=blue size=3>是一个有质量的学习型源码下载站。</font>"

);

var overMe=0;

function txtTyper(str, idx, idObj, spObj, clr1, clr2, delay, plysnd) {

 var tmp0 = tmp1 = '', skip = 0;

   if (both && idx <= str.length) {

if (str.charAt(idx) == '<') { while (str.charAt(idx) != '>') idx++; idx++; }

if (str.charAt(idx) == '&' && str.charAt(idx+1) != ' ') { while (str.charAt(idx) != ';') idx++; idx++; }

tmp0 = str.slice(0,idx);

tmp1 = str.charAt(idx++);

if (overMe==0 && plysnd==1) {

 if (navigator.plugins[0]) {

   if (navigator.plugins["LiveAudio"][0].type=="audio/basic" && navigator.javaEnabled()) {

document.embeds[0].stop();

setTimeout("document.embeds[0].play(false)",100); }

 } else if (document.all) {

ding.Stop();

setTimeout("ding.Run()",100);

 }

 overMe=1;

} else overMe=0;


writeOnText(idObj, "<span class="+spObj+"><font color='"+clr1+"'>"+tmp0+"</font><font color='"+clr2+"'>"+tmp1+"</font></span>");

setTimeout("txtTyper('"+str+"', "+idx+", '"+idObj+"', '"+spObj+"', '"+clr1+"', '"+clr2+"', "+delay+" ,"+plysnd+")",delay);

 }

}


function init() {

txtTyper(dispStr[0], 0, 'ttl0', 'ttl1', '#339933', '#99FF33', 50, 0);

}

// -->

</SCRIPT>

</head>

<body bgcolor="#fef4d9" onload="init()">

<DIV class=ttl1 id=ttl0><SPAN class=ttl1></SPAN></DIV>

</body>

</html>



你可能感兴趣的:(搜索引擎,公告,风格,空间,打字机)