📄 shu11.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">
</head>
<body bgcolor="#fef4d9">
<SCRIPT language=javascript>
<!--
var cx=0;
var cy=0;
var val=0;
function locate()
{	cx=window.event.x;
	cy=window.event.y;
	
}
document.onmousemove=locate;
function follow(i)
{	var x;
	if(i<4)x=cx-50+i*10;
	else x=cx-25+i*10;
	var y=cy-20+Math.floor(Math.random()*40);
	w=eval("word"+i);
	with(w.style)
	{
	left=x.toString()+"px";
	top=y.toString()+"px";
	}
}
function show(i)
{	
	var w=eval("word"+i);
	with(w.style)
	{
	visibility="visible";
	s=parseInt(fontSize);
	if(s>=200)s-=100;
	else if(s>90&&s<=100)
		{
		s-=85;
		clearInterval(val);
		if(i<7)val=setInterval("show("+(i+1)+")",20);
		}	
	fontSize=s;
	}
	
}
function start()
{	for(i=1;i<=7;i++)
	{
	val=setInterval("show(1)",20);
	setInterval("follow("+i+")",100);
	
	}
}	

//-->
</SCRIPT>
<SCRIPT language=javascript>
	var word=new Array(7);
	word[1]="w";word[2]="e";word[3]="l";word[4]="c";word[5]="o";word[6]="m";word[7]="e";
	for(i=1;i<=7;i++)
		document.write("<div id='word"+i+"' style='width:20px;height:20px;position:absolute;font-size:1000;visibility:hidden'><font face='Forte' color='#cc0000'>"+word[i]+"</font></div>");start();

	</SCRIPT>
<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></td></tr>
</table></center>
   
<br>
<br>
<center>
<textarea name=source rows=12 cols=45 class=yk9>
脚本说明:
把如下代码加入<head>区域中
<SCRIPT language=javascript>
<!--//This is a JS program for Sword Jin's JoyFM homepage.All rights reserved.
var cx=0;
var cy=0;
var val=0;
function locate()
{	cx=window.event.x;
	cy=window.event.y;
	
}
document.onmousemove=locate;
function follow(i)
{	var x;
	if(i<4)x=cx-50+i*10;
	else x=cx-25+i*10;
	var y=cy-20+Math.floor(Math.random()*40);
	w=eval("word"+i);
	with(w.style)
	{
	left=x.toString()+"px";
	top=y.toString()+"px";
	}
}
function show(i)
{	
	var w=eval("word"+i);
	with(w.style)
	{
	visibility="visible";
	s=parseInt(fontSize);
	if(s>=200)s-=100;
	else if(s>90&&s<=100)
		{
		s-=85;
		clearInterval(val);
		if(i<5)val=setInterval("show("+(i+1)+")",20);
		}	
	fontSize=s;
	}
	
}
function start()
{	for(i=1;i<=5;i++)
	{
	val=setInterval("show(1)",20);
	setInterval("follow("+i+")",100);
	
	}
}	

//-->
</SCRIPT>
<SCRIPT language=javascript>
	var word=new Array(5);
	word[1]="J";word[2]="o";word[3]="y";word[4]="F";word[5]="m";
	for(i=1;i<=5;i++)
		document.write("<div id='word"+i+"' style='width:20px;height:20px;position:absolute;font-size:1000;visibility:hidden'><font face='Forte' color='#00FF00'>"+word[i]+"</font></div>");start();

	</SCRIPT>
</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 + -