❶ 此网站的鼠标经过图片后的特效是怎样做的
html特效按钮，当鼠标点击更换按钮背景，多个按钮共享一张经过PS后的图片实例代码：
.banner ul{
list-style:none;
float: left;
margin-top:
115px;
margin-right: 0px;
margin-bottom: 2px;
margin-left: 10px;
width: 600px;
line-height: 21px;
height: 21px;
}
.banner li{ text-align:center;
display:inline;
float:left;
margin-right: 15px;
}
.banner a { display:block;
float:left;
width:68px;
height:21px;
}
.banner li a:link,.banner li a:visited{
text-decoration:none; color: #000;
}
.banner li a:hover,.banner li a:active{
text-decoration:none;
background:url(http://boaer.com/images/index_bg.png) no-repeat;
height:21px;
color:#FFFFFF;
}
❷ CSS3上能够支持制作的的鼠标移动到图片上时候的图片特效有哪些啊教我一两个
/***给你个最简单的:<imgsrc="img/card2.png"id="image"/>**/
#image{
transition:.4sallease;
-webkit-transition:.4sallease;
-moz-transition:.4sallease;
}
#image:hover{
transform:rotate(180deg);
-webkit-transform:rotate(180deg);
-moz-transform:rotate(180deg);
}
❸ html 请教 我想做一个图片特效。 鼠标移到图片上，图片切换另一张图。
先插入一个表格，将鼠标定位在表格内，从上面的菜单栏中选择图像→_→鼠标经过点，然后就会出现一个对话框就能选择原图像及鼠标经过点图像，这样就好了，记得给分哦
❹ web前端鼠标经过图片凸起底下有影印怎样做
用css就可以制作出来这种效果。
当鼠标移入的时候用:hover ,给图片一个相对定位，例如偏移top:2px ;left:2px;，然后给右边和下面加阴影，这样就做出了图片凸起的效果了
❺ 这种“鼠标特效”怎么做像镜头光晕一样的效果。●●●
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>网页特效|Linkweb.cn/Js|---很有特色的荧光鼠标</title>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
</head>
<body id="mybody" style="filter:light(enabled=1);" bgcolor="#ffffff" text="#000000">
<div
id="Layer1" style="height: 32; left: 66; position: absolute; top: 41; width: 52">
<dd>
<div align="right">
<img src="images/light.gif" width="29" height="30"> </div>
</dd>
</div>
<p align="center"><b><font size="5">日落大道上的亚洲男孩 </font></b>
</p>
<table border="0" width="100%">
<tr>
<td width="82%"><font face="宋体" color="#FF00FF" style="font-size: 9pt">
</font><span style="font-size: 9pt">
人人爱谈张爱玲，尤其在论及服饰的时候。我不能免俗，也来附庸风雅一番。张爱玲纪念文集提到她逝世时的寓所，地址非常眼熟，后来才知道那公寓就在UC
LA正门附近。我和朋友好奇心起，课后前去朝圣一番，发现果真就是文集照片中的公寓，只不过屋前绿树茁壮更胜以往，和目前公寓的灰暗色调形成讽刺对比。耳闻张爱玲生前喜欢在UCLA附近不时搬迁，居无定所，像一头中枪后逃逸的狐狸，不停回头将沿路滴落的血迹舐去，以免猎人循迹跟上。 <br>
<br>
我以刚出道的猎人口吻说∶传言中张的住所很狼狈，她的衣物都随便搁在纸箱或超级市场收集来的塑胶袋里唷。 <br>
<br>
比我早来洛杉矶数年的同行朋友却说∶有何奇怪？我的衣物书籍也都塞在纸箱和塑胶袋里。搬家的时候反而方便啊。 <br>
<br>
朋友的粗廉生活让我很不以为然；当时我才初抵美国未久。 <br>
<br>
试想，任何华丽的衣裳只要一落进超级市场塑胶袋，看起来就像垃圾。把生活尽数装在塑胶袋里，岂不是将自己完全垃圾化？ <br>
<br>
但，在开始租屋、收集家具之后，我也开始世故驯化。留学生余钱无多，时常面临搬家压力。因此，我很少购衣；如要花钱，选择并不多。 <br>
<br>
从UCLA门口驱车南行，经过张爱玲故居，就来到了”ROSS“成衣批发店。ROSS陈列满坑满谷的名牌服饰，但因都是瑕疵品，比如说胸口的商标掉到肚脐位置的马球衫之类，张冠李戴，品质荒唐，所以售价低廉。许多经济能力较差的黑人和墨西哥人就来这里翻索便宜的CK、耐吉、DKNY；我加入他们肤色鲜艳的行列，结帐时将微疵的战利品装在塑胶袋里－而非百货公司的雅痞纸袋。说不定当年张爱玲也曾经蹋着脸徒步到这里找便宜货，混迹各色人种之间，没有人认出她何许人也。 <br>
<br>
虽然每次光顾ROSS都省了钱，而且享受与有色人种站在同一阵线的政治正确虚荣感，但每一次的经验都极其卑微沮丧。好莱坞电影中，彩色画报里，那种昂首阔步走进香蕉共和国的潇洒意象，在现实美国里却好遥远。还是认份光顾量贩店，站在平庸空间里排队，细细咀嚼外国人的贫穷滋味。 <br>
<br>
时装海报里，那些空灵的躯干之间，并没有留下什么空位给我者。 <br>
<br>
在日落大道两岸，巨幅时装广告海报一张张浮悬空中，像敦煌壁画，海报里俊男美女睥睨众生，佛似的自在庄严，日落大道一如当代加 <br>
<br>
州的丝路。AF，Abercrombie ＆ Fitch的白人男孩在阳光下微笑展示金身，好生慈悲。我猜美国当前年轻男性最风靡的服饰品牌之一大概就是AF，青春的傲慢包装成若无其事的天真潇洒。难怪校园里穿AF的大男孩比比皆是（怪的是，任何人穿了AF就会变得性感）；许多男同志也表示，看了AF男孩就会流口水（许多人在征友广告中表明，想要找AF风格的男孩）。记得春天清晨我行过波士顿哈佛大学，赫然发现哈佛广场前最招摇的海报就来自AF，金发男孩的美丽笑脸占据了整个橱窗，诡异的意象。光是一张笑脸就比一家书店还要庞大。我望之却步了。 <br>
<br>
</span></td>
</tr>
</table>
<script language="vbscript">
dim red,gre,blu
dim x,y,z
red=255
gre=255
blu=0
z=100
sub window_onload()
call mybody.filters.light.addPoint(0,0,z,Red,Gre,Blu,100)
mybody.style.cursor="hand"
end sub
sub document_onmousemove()
x=window.event.x
y=window.event.y
call mybody.filters.Light.MoveLight(0, x, y, 100, 1)
end sub
</script>
<script language="javascript">
//这是使图层移动的函数
function move_layer()
{
Layer1.style.left=event.clientX+document.body.scrollLeft-50;
Layer1.style.top=event.clientY+document.body.scrollTop-20;
}
//这里的意思是，如果鼠标移动时就调用"move_layer"函数
document.onmousemove =move_layer;
</script>
</body>
</html>
❻ 网站中的鼠标特效 在Dreamweaver中改成自己想要的图片或动画
首先，文中提到的在CSS中加入如下代码：
body{cursor:url('鼠标指针图片网址');}
A{cursor:url('鼠标指针图片网址');}
语法上倒是没有什么问题，但是经过多次测试后，发现在不少情况下（尤其是添加了
一些别的特效后）可能会出现IE浏览器崩溃的情况，具体表现就是浏览器的地址栏上下有一片范围会变成黑色，网页背景也可能出现黑色的线条。
仔细分析发现这个A在CSS里总揽太多，其中CSS的三个伪类a:link、a:visited、a:hover都属于A，结果就发生了鼠标指针加载的冲突，从而造成浏览器的崩溃。
经过修改，我认为在CSS中比较正确的统一更改网页鼠标指针的方法是：
body{cursor:url('鼠标指针一的图片网址');}
a:hover{cursor:url('鼠标指针二的图片网址');}
当然，如果你的链接比较多的话，a:hover的鼠标指针图片加载起来可能会比较慢。
你也许追求更灵活的鼠标指针更改方式，那么我们还是用body{cursor:url('鼠标指针的<br/><br/>图片网址');}来加载默认情况下的鼠标指针图片，而当鼠标指针指向某一范围（某一模块内）时则变成另外一个鼠标指针（图片）。换句话说，鼠标移动到不同范围内可以变成不同的鼠标指针样式。具体的做法就是我们在各个模块CSS里对应的标识符内加入{cursor:url('鼠标指针的图片网址');}，比如div#header是头部这个模块的标识符，我们就可以加入：
div#header{cursor:url('鼠标指针的图片网址');}
其它的模块也是类似的加法。
另外我们也可以通过在HTML状态下通过发表文章（代码）来实现更灵活的鼠标指针改变，比如：
<STYLE type=text/css>
BODY{cursor:url('鼠标指针图片一网址');}
a {cursor:url('鼠标指针图片二网址');}�
</STYLE>
❼ 如何用网页特效使鼠标变成其他图案
你可以使用
style
属性或是
CSS。
方法1：使用
style
属性
如果想让全文都是某个鼠标指针，则使用：
<body
style="cursor:指针类型;">
<!--
这里是网页内容
-->
</body>
如果是某个段落，则使用：
<P
style="cursor:指针类型;">
这里是段落内容
</P>
如果是连接，则使用：
<A
href="连接目标"
style="cursor:指针类型;">
这里是连接内容
</A>
以此类推。
方法2：使用
CSS
在<HEAD></HEAD>之间插入：
<style>
<!--
/*
以下部分供选用，不一定全要
*/
body
/*
应用于全文
*/
{
cursor:指针类型;
}
a
/*
应用于标记
<A>
*/
{
cursor:指针类型;
}
p
/*
应用于标记
<P>
*/
{
cursor:指针类型;
}
.Txt
/*
应用于
class
属性为
Txt
的所有标记
*/
{
cursor:指针类型;
}
-->
</style>
其中，指针类型可以是下面的内容（不包括冒号后面的）：
auto：自动
col-resize：左右调整大小（列之间）
crosshair：十字线
default：指针
hand：手形
help：上下文帮助
move：移动
wait：忙
text：水平文本
*-resize：大小调整，其中“*”可以用
N,NE,NW,S,SE,SW,E,W
中的任意一个代替
以下用于
IE6
及以后版本：
all-scroll：上下、左右滚动（相当于按下鼠标中键）
no-drop：不能拖放
not-allowed：不允许
pointer：手形
progress：后台运行（指针和一个沙漏）
row-resize：上下调整大小（行之间）
url('指针路径')：自定义指针文件（*.cur）
例如
url('C:\Hand.cur')
或
url('http:\\www.worldwideweb.org/.../ptr.cur')
或
url('cur/a1.cur')
vertical-text：竖行文本
注意：如果需要在双引号中插入引号（如
url），则可以使用单引号，反过来也可以。
例如：
<body
style='cursor:url("E:\My
Files\Cur\aero_busy.ani");'>
或
<body
style="cursor:url('E:\My
Files\Cur\aero_busy.ani');">
都可以，但后者常见些。
示例（将以下文本替换
Frontpage
中网页源代码部分的
<BODY></BODY>
部分，然后预览，并把鼠标移到每一个段落上）：
<body
style='cursor:default;'>
<p
style='cursor:Move;'>Move
it.</p>
<p
style='cursor:wait;'>Busy.</p>
<p
style='cursor:help;'>Help!</p>
<p
style='cursor:not-allowed;'>Not
Allowed(IE6)</p>
</body>
❽ 网页制作鼠标特效拜托各位大神
星星跟随，你哪个要求太高！ <html> <head> <title>网页特效|Linkweb.cn/Js|---围绕鼠标的七彩流星</title> </head> <body bgcolor="#000000" text="#000000"> <LAYER NAME="a0" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#ffffff" CLIP="0,0,1,1"> </LAYER> <LAYER NAME="a1" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#fff000" CLIP="0,0,1,1"> </LAYER> <LAYER NAME="a2" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#ffa000" CLIP="0,0,1,1"> </LAYER> <LAYER NAME="a3" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#ff00ff" CLIP="0,0,1,1"> </LAYER> <LAYER NAME="a4" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#00ff00" CLIP="0,0,1,1"> </LAYER> <LAYER NAME="a5" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#FF00FF" CLIP="0,0,1,1"> </LAYER> <LAYER NAME="a6" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#FF0000" CLIP="0,0,1,1"> </LAYER> <LAYER NAME="a7" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#ffffff" CLIP="0,0,2,2"> </LAYER> <LAYER NAME="a8" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#fff000" CLIP="0,0,2,2"> </LAYER> <LAYER NAME="a9" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#ffa000" CLIP="0,0,2,2"> </LAYER> <LAYER NAME="a10" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#ff00ff" CLIP="0,0,2,2"> </LAYER> <LAYER NAME="a11" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#00ff00" CLIP="0,0,2,2"> </LAYER> <LAYER NAME="a12" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#0000ff" CLIP="0,0,2,2"> </LAYER> <LAYER NAME="a13" LEFT="10" TOP="10" VISIBILITY="SHOW" BGCOLOR="#FF0000" CLIP="0,0,3,3"> </LAYER> <div id="starsDiv" style="position:absolute;top:0px;left:0px"><div style="position:relative;width:1px;height:1px;background:#fff000;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#ffa000;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#ff00ff;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#00ff00;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#0000ff;font-size:1px;visibility:visible"></div><div style="position:relative;width:1px;height:1px;background:#FF0000;font-size:1px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#ffffff;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#fff000;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#ffa000;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#ff00ff;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#00ff00;font-size:2px;visibility:visible"></div><div style="position:relative;width:2px;height:2px;background:#0000ff;font-size:2px;visibility:visible"></div><div style="position:relative;width:3px;height:3px;background:#FF0000;font-size:3px;visibility:visible"></div></div><script LANGUAGE="JavaScript"> var Clrs = new Array(6); Clrs[0] = 'ff0000'; Clrs[1] = '00ff00'; Clrs[2] = '000aff'; Clrs[3] = 'ff00ff'; Clrs[4] = 'fff000'; Clrs[5] = 'fffff0'; var yBase = 200; var xBase = 200; var step; var currStep = 0; var Xpos = 1; var Ypos = 1; var Xs = 200; var Ys = 400; if (document.layers) { window.captureEvents(Event.MOUSEMOVE); } if (document.all) { function MoveHandler() { Xpos = document.body.scrollLeft+event.x; Ypos = document.body.scrollTop+event.y; } document.onmousemove = MoveHandler; } else if (document.layers) { function xMoveHandler(evnt) { Xpos = evnt.pageX; Ypos = evnt.pageY; } window.onMouseMove = xMoveHandler; } function Comet() { if (document.all) { yBase = window.document.body.offsetHeight / 4; xBase = window.document.body.offsetWidth / 4; } else if (document.layers) { yBase = window.innerHeight / 4; xBase = window.innerWidth / 4; } if (document.all) { for ( i = 0 ; i < starsDiv.all.length ; i++ ) { step = 3; starsDiv.all[i].style.top = Ypos + yBase*Math.cos((currStep + i*4)/12)*Math.cos(0.7+currStep/200); starsDiv.all[i].style.left = Xpos + xBase*Math.sin((currStep + i*3)/10)*Math.sin(8.2+currStep/400); for (ai = 0; ai < Clrs.length; ai++) { var c=Math.round(Math.random()*[ai]); } starsDiv.all[i].style.background = Clrs[c]; } } else if (document.layers) { for ( j = 0 ; j < 14 ; j++ ) { //number of NS layers! step = 6; var templayer = "a"+j; document.layers[templayer].top = Ypos + yBase*Math.cos((currStep + j*4)/12)*Math.cos(0.7+currStep/200); document.layers[templayer].left = Xpos + xBase*Math.sin((currStep + j*3)/10)*Math.sin(8.2+currStep/400); for (aj=0; aj < Clrs.length; aj++) { var c=Math.round(Math.random()*[aj]); } document.layers[templayer].bgColor = Clrs[c]; } } currStep += step; setTimeout("Comet()", 5); } Comet(); // End --> </script> </body> </html> 星星
记得采纳啊
❾ 网页特效 鼠标移到字上会出现图片，有高手会么
可以做的呀，用层来做
<style>
.munetitle { text-decoration: none; font-size: 10pt; background-color: #F5F5F5; width: 70; height: 16; color: #000000 }
.munebar { position: absolute;z-index: 1;}
.mune { background-color: #F5F5F5; display: none; position: absolute; z-index: 1;left: 0; top: 18; width: 1 }
</style>
<script>
<!--
function w(word)
{
document.write(word);
}
//显示或隐藏菜单
function showmune(object,status)
{
object.style.display=status;
}
//首页的选项
var mune = "index"
var munetitle = "LuckyBar"
var titlepath = ""
var indextitle = new Array();
var indexpath = new Array();
//indextitle[0]="申请做版主";indexpath[0]="apply.htm";
indextitle[0]="加入收藏夹";indexpath[0]="javascript:window.external.addFavorite(top.window.location.href,top.document.title) target=_self";
indextitle[1]="关于本站";indexpath[1]="luckybar/about.htm";
w('<div class=munebar onmouseover=showmune(' + mune + ',"block") onmouseout=showmune(' + mune + ',"none")>');
w('<table border=1 height=18 bordercolordark=#FFFFFF bordercolorlight=#000000 cellspacing=0 cellpadding=0>');
w('<tr><td align=center class=munetitle><a href="' + titlepath + '" class=munetitle>' + munetitle + '</a></td></tr></table>');
w('<div id=' + mune + ' class=mune>');
w('<table border=1 bordercolordark=#FFFFFF bordercolorlight=#000000 width=100 cellspacing=0 cellpadding=0>');
for(i=0;i<indextitle.length;i++)
{
w('<tr><td><a href=' + indexpath[i] + '>' + indextitle[i] + '</a></td></tr>');
}
w('</table></div></div>');
delete indextitle;
delete indexpath;
//-->
</script>
❿ 急求各种网页鼠标特效代码（只要代码，不要网址）
很酷的跟随鼠标的三色彩带
html>
<head>
<title>网页特效|Linkweb.cn/Js|---很酷的跟随鼠标的三色彩带</title>
</head><body bgColor=#000000>
<!--将以下代码加入HTML的<Body></Body>之间-->
<script language="JavaScript">
<!--
var a_Colour='fff000';
var b_Colour='00ff00';
var c_Colour='ff00ff';
var Size=120;
var YDummy=new Array(),XDummy=new Array(),xpos=0,ypos=0,ThisStep=0;step=0.6;
if (document.layers){
window.captureEvents(Event.MOUSEMOVE);
function nsMouse(evnt){
xpos = window.pageYOffset+evnt.pageX+6;
ypos = window.pageYOffset+evnt.pageY+16;
}
window.onMouseMove = nsMouse;
}
else if (document.all)
{
function ieMouse(){
xpos = document.body.scrollLeft+event.x+6;
ypos = document.body.scrollTop+event.y+16;
}
document.onmousemove = ieMouse;
}
function swirl(){
for (i = 0; i < 3; i++)
{
YDummy[i]=ypos+Size*Math.sin((1*Math.sin((ThisStep)/10))+i*2)*Math.sin((ThisStep)/4);
XDummy[i]=xpos+Size*Math.cos((1*Math.sin((ThisStep)/10))+i*2)*Math.sin((ThisStep)/4);
}
ThisStep+=step;
setTimeout('swirl()',10);
}
var amount=10;
if (document.layers){
for (i = 0; i < amount; i++)
{
document.write('<layer name=nsa'+i+' top=0 left=0 width='+i/2+' height='+i/2+' bgcolor='+a_Colour+'></layer>');
document.write('<layer name=nsb'+i+' top=0 left=0 width='+i/2+' height='+i/2+' bgcolor='+b_Colour+'></layer>');
document.write('<layer name=nsc'+i+' top=0 left=0 width='+i/2+' height='+i/2+' bgcolor='+c_Colour+'></layer>');
}
}
else if (document.all){
document.write('<div id="ODiv" style="position:absolute;top:0px;left:0px">'
+'<div id="IDiv" style="position:relative">');
for (i = 0; i < amount; i++)
{
document.write('<div id=x style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+a_Colour+';font-size:'+i/2+'"></div>');
document.write('<div id=y style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+b_Colour+';font-size:'+i/2+'"></div>');
document.write('<div id=z style="position:absolute;top:0px;left:0px;width:'+i/2+';height:'+i/2+';background:'+c_Colour+';font-size:'+i/2+'"></div>');
}
document.write('</div></div>');
}
function prepos(){
var ntscp=document.layers;
var msie=document.all;
if (document.layers){
for (i = 0; i < amount; i++)
{
if (i < amount-1)
{
ntscp['nsa'+i].top=ntscp['nsa'+(i+1)].top;ntscp['nsa'+i].left=ntscp['nsa'+(i+1)].left;
ntscp['nsb'+i].top=ntscp['nsb'+(i+1)].top;ntscp['nsb'+i].left=ntscp['nsb'+(i+1)].left;
ntscp['nsc'+i].top=ntscp['nsc'+(i+1)].top;ntscp['nsc'+i].left=ntscp['nsc'+(i+1)].left;
}
else
{
ntscp['nsa'+i].top=YDummy[0];ntscp['nsa'+i].left=XDummy[0];
ntscp['nsb'+i].top=YDummy[1];ntscp['nsb'+i].left=XDummy[1];
ntscp['nsc'+i].top=YDummy[2];ntscp['nsc'+i].left=XDummy[2];
}
}
}
else if (document.all){
for (i = 0; i < amount; i++)
{
if (i < amount-1)
{
msie.x[i].style.top=msie.x[i+1].style.top;msie.x[i].style.left=msie.x[i+1].style.left;
msie.y[i].style.top=msie.y[i+1].style.top;msie.y[i].style.left=msie.y[i+1].style.left;
msie.z[i].style.top=msie.z[i+1].style.top;msie.z[i].style.left=msie.z[i+1].style.left;
}
else
{
msie.x[i].style.top=YDummy[0];msie.x[i].style.left=XDummy[0];
msie.y[i].style.top=YDummy[1];msie.y[i].style.left=XDummy[1];
msie.z[i].style.top=YDummy[2];msie.z[i].style.left=XDummy[2];
}
}
}
setTimeout("prepos()",10);
}
function Start(){
swirl(),prepos()
}
window.onload=Start;
// -->
</script>
</body></html>
跟随鼠标很逼真的弹性小球
<html>
<head>
<title>网页特效|Linkweb.cn/Js|---跟随鼠标很逼真的弹性小球</title>
</head><body>
<!--将以下代码加入HTML的<Body></Body>之间-->
<DIV id=dot0
style="HEIGHT: 16; POSITION: absolute; VISIBILITY: hidden; WIDTH: 11; left:10; top:15"><IMG
height=11 src="images/bullet.gif" width=11> </DIV>
<DIV id=dot1 style="HEIGHT: 11px; POSITION: absolute; WIDTH: 11px"><IMG
height=11 src="images/bullet.gif" width=11> </DIV>
<DIV id=dot2 style="HEIGHT: 11px; POSITION: absolute; WIDTH: 11px"><IMG
height=11 src="images/bullet.gif" width=11> </DIV>
<DIV id=dot3 style="HEIGHT: 11px; POSITION: absolute; WIDTH: 11px"><IMG
height=11 src="images/bullet.gif" width=11> </DIV>
<DIV id=dot4 style="HEIGHT: 11px; POSITION: absolute; WIDTH: 11px"><IMG
height=11 src="images/bullet.gif" width=11> </DIV>
<DIV id=dot5 style="HEIGHT: 11px; POSITION: absolute; WIDTH: 11px"><IMG
height=11 src="images/bullet.gif" width=11> </DIV>
<DIV id=dot6 style="HEIGHT: 16; POSITION: absolute; WIDTH: 11; left:10; top:15"><IMG
height=11 src="images/bullet.gif" width=11> </DIV>
<SCRIPT language=JavaScript>
var nDots = 7;
var Xpos = 0;
var Ypos = 0;
var DELTAT = .01;
var SEGLEN = 10;
var SPRINGK = 10;
var MASS = 1;
var XGRAVITY = 0;
var YGRAVITY = 50;
var RESISTANCE = 10;
var STOPVEL = 0.1;
var STOPACC = 0.1;
var DOTSIZE = 11;
var BOUNCE = 0.75;
var isNetscape = navigator.appName=="Netscape";
var followmouse = true;
var dots = new Array();
init();
function init()
{
var i = 0;
for (i = 0; i < nDots; i++) {
dots[i] = new dot(i);
}
if (!isNetscape) {
}
for (i = 0; i < nDots; i++) {
dots[i].obj.left = dots[i].X;
dots[i].obj.top = dots[i].Y;
}
if (isNetscape) {
startanimate();
} else {
setTimeout("startanimate()", 1000);
}
}
function dot(i)
{
this.X = Xpos;
this.Y = Ypos;
this.dx = 0;
this.dy = 0;
if (isNetscape) {
this.obj = eval("document.dot" + i);
} else {
this.obj = eval("dot" + i + ".style");
}
}
function startanimate() {
setInterval("animate()", 20);
}
function setInitPositions(dots)
{
var startloc = document.all.tags("LI");
var i = 0;
for (i = 0; i < startloc.length && i < (nDots - 1); i++) {
dots[i+1].X = startloc[i].offsetLeft
startloc[i].offsetParent.offsetLeft - DOTSIZE;
dots[i+1].Y = startloc[i].offsetTop +
startloc[i].offsetParent.offsetTop + 2*DOTSIZE;
}
dots[0].X = dots[1].X;
dots[0].Y = dots[1].Y - SEGLEN;
}
function MoveHandler(e)
{
Xpos = e.pageX;
Ypos = e.pageY;
return true;
}
function MoveHandlerIE() {
Xpos = window.event.x + document.body.scrollLeft;
Ypos = window.event.y + document.body.scrollTop;
}
if (isNetscape) {
document.captureEvents(Event.MOUSEMOVE);
document.onMouseMove = MoveHandler;
} else {
document.onmousemove = MoveHandlerIE;
}
function vec(X, Y)
{
this.X = X;
this.Y = Y;
}
function springForce(i, j, spring)
{
var dx = (dots[i].X - dots[j].X);
var dy = (dots[i].Y - dots[j].Y);
var len = Math.sqrt(dx*dx + dy*dy);
if (len > SEGLEN) {
var springF = SPRINGK * (len - SEGLEN);
spring.X += (dx / len) * springF;
spring.Y += (dy / len) * springF;
}
}
function animate() {
var start = 0;
if (followmouse) {
dots[0].X = Xpos;
dots[0].Y = Ypos;
start = 1;
}
for (i = start ; i < nDots; i++ ) {
var spring = new vec(0, 0);
if (i > 0) {
springForce(i-1, i, spring);
}
if (i < (nDots - 1)) {
springForce(i+1, i, spring);
}
var resist = new vec(-dots[i].dx * RESISTANCE,
-dots[i].dy * RESISTANCE);
var accel = new vec((spring.X + resist.X)/MASS + XGRAVITY,
(spring.Y + resist.Y)/ MASS + YGRAVITY);
dots[i].dx += (DELTAT * accel.X);
dots[i].dy += (DELTAT * accel.Y);
if (Math.abs(dots[i].dx) < STOPVEL &&
Math.abs(dots[i].dy) < STOPVEL &&
Math.abs(accel.X) < STOPACC &&
Math.abs(accel.Y) < STOPACC) {
dots[i].dx = 0;
dots[i].dy = 0;
}
dots[i].X += dots[i].dx;
dots[i].Y += dots[i].dy;
var height, width;
if (isNetscape) {
height = window.innerHeight + window.pageYOffset;
width = window.innerWidth + window.pageXOffset;
} else {
height = document.body.clientHeight + document.body.scrollTop;
width = document.body.clientWidth + document.body.scrollLeft;
}
if (dots[i].Y >= height - DOTSIZE - 1) {
if (dots[i].dy > 0) {
dots[i].dy = BOUNCE * -dots[i].dy;
}
dots[i].Y = height - DOTSIZE - 1;
}
if (dots[i].X >= width - DOTSIZE) {
if (dots[i].dx > 0) {
dots[i].dx = BOUNCE * -dots[i].dx;
}
dots[i].X = width - DOTSIZE - 1;
}
if (dots[i].X < 0) {
if (dots[i].dx < 0) {
dots[i].dx = BOUNCE * -dots[i].dx;
}
dots[i].X = 0;
}
dots[i].obj.left = dots[i].X;
dots[i].obj.top = dots[i].Y;
}
}
</SCRIPT>
</body></html>
这里太小了 放不了那么多
http://www.jscode.cn/jave_mouse/29051032.htm
里面有很多的 不想链接的话 就看那两个吧