📄 ye2.htm

📁 javascript各种效果的实例及源代码
💻 HTM
字号:
<html>
<head>
<title>打字机式字符输出</title>
<style type="text/css">
<!--
body {  font-family: "宋体"; font-size: 9pt; margin-top: 0px; margin-left: 0px; margin-right: 0px}
A { COLOR: black; FONT-SIZE: 9pt; FONT-WEIGHT: 400; TEXT-DECORATION: none }
 A:hover { COLOR: red; FONT-SIZE: 9pt; FONT-WEIGHT: 400; TEXT-DECORATION: underline }
a:active     { font: 9pt "宋体"; cursor: hand; color: #FF0033 }

-->
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<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>欢迎光临精彩JavaScript世界...</font><br><font color=green size=3>你知道怎样在你的网页中做一个很酷的网页菜单吗?</font><br><font color=red size=3>你知道怎样让你的网页背景向上或向下移动吗?</font><br><font color=blue size=3>你知道怎样在你的主页中任意位置显示一个时钟吗?</font><br><font color=red size=3>你知道怎样在主页中做特效文字吗?</font><br><font color=black size=3>你知道怎样做一个很cool的日历吗?</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()> 
<br>
<br>
<center><font color=red face="隶书" size=6>打字机式字符输出</font></center>
<br>
<center>
<table border=5 bordercolor=blue borderlight=green>
<tr><td align=center><font size=5 color=red face="Arial, Helvetica, sans-serif"><strong>下面为效果显示区!</strong></font></td></tr><tr><td align=center height=170 width=400><DIV class=ttl1 id=ttl0><SPAN class=ttl1></SPAN></DIV></td></tr>
</table></center>
<br>
<br>
<center>
<textarea name=source rows=12 cols=45 class=yk9>
脚本说明:
第一步:把如下代码加入<head>区域中
<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>欢迎光临精彩JavaScript世界...</font><br><font color=green size=3>你知道怎样在你的网页中做一个很酷的网页菜单吗?</font><br><font color=red size=3>你知道怎样让你的网页背景向上或向下移动吗?</font><br><font color=blue size=3>你知道怎样在你的主页中任意位置显示一个时钟吗?</font><br><font color=red size=3>你知道怎样在主页中做特效文字吗?</font><br><font color=black size=3>你知道怎样做一个很cool的日历吗?</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>


第二步:把如下代码加入<body>区域中
<DIV class=ttl1 id=ttl0><SPAN class=ttl1></SPAN></DIV>


第三步:把<body>改为
<body bgcolor="#fef4d9" onload="onload=init()">

</textarea>
<SCRIPT LANGUAGE="JavaScript">

<!-- hide

function goHist(a) 

{

   history.go(a);

}

//-->

</script>

<FORM METHOD="post">
<INPUT TYPE="button" VALUE="返回" onClick="goHist(-1)" style="background-color: #8000FF; color: rgb(255,255,255)">
</form>
</center>
<br>
<br>
</body>
</html>
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -