📄 w0002.htm
字号:
if(dyn)
outString += "</SPAN>"
}
function animate()
{
el = animateElements[currentElement]
animation = el.getAttribute(dynamicanimAttr, false)
step++
if(animation == "spiral")
{
steps = stepsSpiral
v = step/steps
rf = 1.0 - v
t = v * 2.0*Math.PI
rx = Math.max(Math.abs(el.initLeft), 200)
ry = Math.max(Math.abs(el.initTop), 200)
el.style.posLeft = Math.ceil(-rf*Math.cos(t)*rx)
el.style.posTop = Math.ceil(-rf*Math.sin(t)*ry)
}
else if(animation == "zoomIn")
{
steps = stepsZoom
el.style.fontSize = Math.ceil(50+50*step/steps) + "%"
el.style.posLeft = 0
}
else if(animation == "zoomOut")
{
steps = stepsZoom
el.style.fontSize = Math.ceil(100+200*(steps-step)/steps) + "%"
el.style.posLeft = 0
}
else
{
steps = stepsFly
if(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord")
steps = stepsWord
dl = el.initLeft / steps
dt = el.initTop / steps
el.style.posLeft = el.style.posLeft - dl
el.style.posTop = el.style.posTop - dt
}
if (step >= steps)
{
el.style.posLeft = 0
el.style.posTop = 0
currentElement++
step = 0
}
if(currentElement < animateElements.length)
window.setTimeout("animate();", speed)
}
//-->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!-- A:link {text-decoration: none; color:#000000}
A:visited {text-decoration: none; color: #000000}
A:active {text-decoration: none; color: #FF0000}
A:hover {text-decoration: underline; color: FF0000}
body{font-size=9pt}
TH{FONT-SIZE: 9pt}
TD{ FONT-SIZE: 9pt}-->
</style>
<title>《网络教程》之Javascript--动态文字—— 01</title>
</head>
<body topmargin="0" leftmargin="0" onload="dynAnimation8()">
<div align="center"><center>
<table border="0" width="90%" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" colspan="3" height="62"><div align="center"><center><table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="250"><img src="../photo/jx.gif" border="0" WIDTH="200" HEIGHT="80"></td>
<td width="468" height="60"></td>
</tr>
</table>
</center></div></td>
</tr>
<tr>
<td width="20%" bgcolor="#C8C882" valign="middle" align="center" height="22"></td>
<td width="80%" bgcolor="#C8C882" valign="middle" align="center" colspan="2" height="22"><strong><span style="font-size: 10pt; font-family: Arial">javascript文字类</span></strong></td>
</tr>
<tr>
<td width="20%" valign="top" align="left"><div align="center"><center><table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" valign="middle" align="center" height="30" bgcolor="#C8C882"><span style="font-size: 9pt"><a href="index.htm">时间类</a></span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="30" bgcolor="#C8C882"><span style="font-size: 9pt"><a href="index.htm">文字类</a></span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="30" bgcolor="#C8C882"><span style="font-size: 9pt"><a href="index.htm">导航类</a></span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="30" bgcolor="#C8C882"><span style="font-size: 9pt"><a href="index.htm">鼠标类</a></span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="30" bgcolor="#C8C882"><span style="font-size: 9pt"><a href="index.htm">按钮类</a></span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="30" bgcolor="#C8C882"><span style="font-size: 9pt"><a href="index.htm">跑马灯</a></span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="30" bgcolor="#C8C882"><span style="font-size: 9pt"><a href="index.htm"><font face="Arial"><strong>COOKIE</strong></font>类</a></span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="30" bgcolor="#C8C882"><span style="font-size: 9pt"><a href="index.htm">其他类</a></span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="10" bgcolor="#505028"></td>
</tr>
</table>
</center></div></td>
<td width="80%" valign="top" align="left" colspan="2" height="242"><div align="center"><center><table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" bgcolor="#EBEBEB" valign="middle" align="center" height="18" colspan="3"><span style="font-size: 9pt">动态文字—— 01</span></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="2" colspan="3"></td>
</tr>
<tr>
<td width="100%" valign="middle" align="center" height="1" colspan="3" bgcolor="#000080"></td>
</tr>
<tr>
<td width="16%" valign="middle" align="center" height="22"></td>
<td width="67%" valign="middle" align="center" height="22"><p align="center" style="LEFT: 10000px! important; POSITION: relative! important" dynamicanimation8="dropWord"><font color="rgb(128,128,192)" size="3">电 脑 故 障 ? ！</font><b><font color="red" face="Arial, Helvetica, sans-serif" size="10">NO </font><font color="red" size="10">！ </font></b></p>
<p> </td>
<td width="17%" valign="middle" align="center" height="22"></td>
</tr>
<tr>
<td width="16%" valign="middle" align="center" height="20"></td>
<td width="67%" valign="middle" align="center" height="20"></td>
<td width="17%" valign="middle" align="center" height="20"></td>
</tr>
<tr>
<td width="16%" valign="middle" align="center" height="22" rowspan="5"></td>
<td width="67%" valign="middle" align="left" height="6" bgcolor="#F0FAFF"><font color="#FF0000">第一步：</font><span style="font-size: 9pt; color: rgb(255,0,0)">拷贝下面的代码到你的html文件的<head>和</head>之间</span></td>
<td width="17%" valign="middle" align="center" height="22" rowspan="5"></td>
</tr>
<tr>
<td width="67%" valign="middle" align="center" height="6" bgcolor="#F0FAFF"><textarea rows="8" name="S1" cols="40" onMouseOver="this.focus()" onFocus="this.select()"><script language="JavaScript" FPTYPE="dynamicanimation8">
<!-- dynamicanimAttr = "dynamicanimation8" animateElements = new Array() currentElement = 0 speed = 0 stepsZoom = 8 stepsWord = 8 stepsFly = 12 stepsSpiral = 16 steps = stepsZoom step = 0 outString = "" function dynAnimation8() { var ms = navigator.appVersion.indexOf("MSIE") ie4 = (ms>0) && (parseInt(navigator.appVersion.substring(ms+5, ms+6)) >= 4) if(!ie4) { if((navigator.appName == "Netscape") && (parseInt(navigator.appVersion.substring(0, 1)) >= 4)) { for (index=document.layers.length-1; index >= 0; index--) { layer=document.layers[index] if (layer.left==10000) layer.left=0 } } return } for (index=document.all.length-1; index >= document.body.sourceIndex; index--) { el = document.all[index] animation = el.getAttribute(dynamicanimAttr, false) if(null != animation) { if(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord") { ih = el.innerHTML outString = "" i1 = 0 iend = ih.length while(true) { i2 = startWord(ih, i1) if(i2 == -1) i2 = iend outWord(ih, i1, i2, false, "") if(i2 == iend) break i1 = i2 i2 = endWord(ih, i1) if(i2 == -1) i2 = iend outWord(ih, i1, i2, true, animation) if(i2 == iend) break i1 = i2 } document.all[index].innerHTML = outString document.all[index].style.posLeft = 0 document.all[index].setAttribute(dynamicanimAttr, null) } if(animation == "zoomIn" || animation == "zoomOut") { ih = el.innerHTML outString = "<SPAN " + dynamicanimAttr + "=\"" + animation + "\" style=\"position: relative; left: 10000;\">" outString += ih outString += "</SPAN>" document.all[index].innerHTML = outString document.all[index].style.posLeft = 0 document.all[index].setAttribute(dynamicanimAttr, null) } } } i = 0 for (index=document.body.sourceIndex; index < document.all.length; index++) { el = document.all[index] animation = el.getAttribute(dynamicanimAttr, false) if (null != animation) { if(animation == "flyLeft") { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = 0 } else if(animation == "flyRight") { el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth el.style.posTop = 0 } else if(animation == "flyTop" || animation == "dropWord") { el.style.posLeft = 0 el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight } else if(animation == "flyBottom") { el.style.posLeft = 0 el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight } else if(animation == "flyTopLeft") { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight } else if(animation == "flyTopRight" || animation == "flyTopRightWord") { el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight } else if(animation == "flyBottomLeft") { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight } else if(animation == "flyBottomRight" || animation == "flyBottomRightWord") { el.style.posLeft = 10000-offsetLeft(el)+document.body.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)+document.body.offsetHeight } else if(animation == "spiral") { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = document.body.scrollTop-offsetTop(el)-el.offsetHeight } else if(animation == "zoomIn") { el.style.posLeft = 10000 el.style.posTop = 0 } else if(animation == "zoomOut") { el.style.posLeft = 10000 el.style.posTop = 0 } else { el.style.posLeft = 10000-offsetLeft(el)-el.offsetWidth el.style.posTop = 0 } el.initLeft = el.style.posLeft el.initTop = el.style.posTop animateElements[i++] = el } } window.setTimeout("animate();", speed) } function offsetLeft(el) { x = el.offsetLeft for (e = el.offsetParent; e; e = e.offsetParent) x += e.offsetLeft; return x } function offsetTop(el) { y = el.offsetTop for (e = el.offsetParent; e; e = e.offsetParent) y += e.offsetTop; return y } function startWord(ih, i) { for(tag = false; i < ih.length; i++) { c = ih.charAt(i) if(c == '<') tag = true if(!tag) return i if(c == '>') tag = false } return -1 } function endWord(ih, i) { nonSpace = false space = false while(i < ih.length) { c = ih.charAt(i) if(c != ' ') nonSpace = true if(nonSpace && c == ' ') space = true if(c == '<') return i if(space && c != ' ') return i i++ } return -1 } function outWord(ih, i1, i2, dyn, anim) { if(dyn) outString += "<SPAN " + dynamicanimAttr + "=\"" + anim + "\" style=\"position: relative; left: 10000;\">" outString += ih.substring(i1, i2) if(dyn) outString += "</SPAN>" } function animate() { el = animateElements[currentElement] animation = el.getAttribute(dynamicanimAttr, false) step++ if(animation == "spiral") { steps = stepsSpiral v = step/steps rf = 1.0 - v t = v * 2.0*Math.PI rx = Math.max(Math.abs(el.initLeft), 200) ry = Math.max(Math.abs(el.initTop), 200) el.style.posLeft = Math.ceil(-rf*Math.cos(t)*rx) el.style.posTop = Math.ceil(-rf*Math.sin(t)*ry) } else if(animation == "zoomIn") { steps = stepsZoom el.style.fontSize = Math.ceil(50+50*step/steps) + "%" el.style.posLeft = 0 } else if(animation == "zoomOut") { steps = stepsZoom el.style.fontSize = Math.ceil(100+200*(steps-step)/steps) + "%" el.style.posLeft = 0 } else { steps = stepsFly if(animation == "dropWord" || animation == "flyTopRightWord" || animation == "flyBottomRightWord") steps = stepsWord dl = el.initLeft / steps dt = el.initTop / steps el.style.posLeft = el.style.posLeft - dl el.style.posTop = el.style.posTop - dt } if (step >= steps) { el.style.posLeft = 0 el.style.posTop = 0 currentElement++ step = 0 } if(currentElement < animateElements.length) window.setTimeout("animate();", speed) }//-->
</script></textarea></td>
</tr>
<tr>
<td width="67%" valign="middle" align="left" height="5" bgcolor="#F0FAFF"><font color="#FF0000">第二步：</font><span style="font-size: 9pt; color: rgb(255,0,0)">拷贝下面的代码到你的html文件的<body>和</body>之间</span></td>
</tr>
<tr>
<td width="67%" valign="middle" align="center" height="3" bgcolor="#F0FAFF"><textarea rows="8" name="S1" cols="40" onMouseOver="this.focus()" onFocus="this.select()"><p align="center"
style="LEFT: 10000px! important; POSITION: relative! important"
dynamicanimation8="dropWord"><font color="rgb(128,128,192)" size="3">电 脑 故 障 ? ！</font><b><font
color="red" face="Arial, Helvetica, sans-serif" size="10">NO </font><font color="red"
size="10">！ </font></b></p></textarea></td>
</tr>
<tr>
<td width="67%" valign="middle" align="left" height="2" bgcolor="#F0FAFF"><font color="#FF0080">注意：要将文件中的<body>语句修改为</font><font color="#000040"><body onload="dynAnimation8()"></font><br>
<font color="#FF0080">汉字间加一个空格，汉字就会一个个地掉下来，否则会一起掉下来。</font></td>
</tr>
</table>
</center></div></td>
</tr>
<tr>
<td width="20%" bgcolor="#FFFFFF" valign="middle" align="center" height="20"></td>
<td width="60%" height="20"></td>
<td width="20%" height="20"></td>
</tr>
<tr>
<td width="20%" bgcolor="#FFFFFF" valign="middle" align="center" height="17"></td>
<td width="60%" height="17"><p align="center"><span style="font-size: 9pt"><a href="w0001.htm">上一页</a> <a href="w0003.htm">下一页</a></span></td>
<td width="20%" height="17"></td>
</tr>
<tr>
<td width="20%" bgcolor="#FFFFFF" valign="middle" align="center" height="14"></td>
<td width="60%" height="14"></td>
<td width="20%" height="14"></td>
</tr>
<tr>
<td width="20%" bgcolor="#FFFFFF" valign="middle" align="center" height="14"></td>
<td width="60%" height="14"></td>
<td width="20%" height="14"></td>
</tr>
<tr>
<td width="20%" bgcolor="#FFFFFF" valign="middle" align="center" height="47"></td>
<td width="60%" height="47"><div align="center"><center><table cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><p align="center"><font color="#969696"><span style="font-size: 9pt">《天索星网》
星网制作 版权所有</span></font></td>
</tr>
<tr>
<td width="100%"><p align="center"><font color="#969696"><span style="font-size: 9pt; font-family: Arial">©2000-2001 All Rights Reserved</span></font></td>
</tr>
<tr>
<td width="100%"></td>
</tr>
</table>
</center></div></td>
<td width="20%" height="47"></td>
</tr>
</table>
</center></div>
</body>
</html>
<!--Saved from天索星网 版权所有;http://www.tasoo.2000c.net,E-mail:tasoo_cn@yahoo.com.cn-->
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -