金税盘会计分录:编程高手??

来源:百度文库 编辑:杭州交通信息网 时间:2024/05/08 07:42:53
网页中,跟着鼠标跑的字、图片什么的怎么做?

这也是高手解决的问题?

在网上冲浪时,你是否对某些网页上的可以动态跟随你的鼠标踪迹记忆尤新呢?的确,在网页上实现鼠标跟随,这种互动效果能带给来访者留下深刻的印象。而,现在不少网站通过FLASH来实现这个效果,但因为IE和NC都要安装插件才能观看,于是就有了相当的局限性。用JAVASCRIPT实现该效果,就有天然的优势了——浏览器自动识别。下文将讲述如何
用JAVASCRIPT实现鼠标跟随。

程序的主要思路是把跟随鼠标的6个小点放在6个透明的层上,然后通过一个 TIMER,定时通过document.captureEvents(Event.MOUSEMOVE)函数获得鼠标的X,Y 坐标,然后计算和重画6个层,从而实现6个彩色小点跟随着鼠标。

< html >
< head >
< title >Mouse trace< /title >
< script LANGUAGE="JavaScript" >
< !--
function Layerfx(yyleft,yytop,yyfnx,yyfny,yydiv,
yybilder,yyloop,yyto,yycnt,yystep)
{ // 设置重绘层的Layerfx函数
if ((document.layers)||(document.all)){
with (Math) {yynextx= eval(yyfnx)}
with (Math) {yynexty= eval(yyfny)}
yycnt=(yyloop && yycnt >
=yystep*yybilder)?0:yycnt+yystep;
if (document.layers){//针对NC浏览器定义层的坐标
eval(yydiv+".top="+(yynexty+yytop))
eval(yydiv+".left="+(yynextx+yyleft))
}
if (document.all){//针对IE浏览器定义层的坐标
eval("yydiv=yydiv.replace(/.layers/gi, '.all')");
eval(yydiv+".style.pixelTop="+(yynexty+yytop));
eval(yydiv+".style.pixelLeft="+(yynextx+yyleft));
}
argStr='Layerfx('+yyleft+','+yytop+',"'+yyfnx+'",
"'+yyfny+'","'+yydiv+'",'+yybilder+','+yyloop+',
'+yyto+','+yycnt+','+yystep+')';
if (yycnt< =yystep*yybilder)
{
eval(yydiv+".yyto=setTimeout(argStr,yyto)");}
//加入时间控制
}

}
function Mousetrace(evnt)
{
if (yyns4) //针对NC浏览器,根据鼠标位置,
获得层新的X,Y坐标
{if (evnt.pageX) {ml=evnt.pageX; mt=evnt.pageY;} }
else{ //针对IE浏览器,根据鼠标位置,
获得层新的X,Y坐标
ml=(event.clientX + document.body.scrollLeft);
mt=(event.clientY + document.body.scrollTop);
}
if (tracescript)eval(tracescript)
}
//-- >
< /script >

< body bgcolor="#FFFFFF" >
< div align="center" >< center >
< table border="0" cellpadding="0"
cellspacing="0" width="100%" >
< /table >
//作一个全屏幕的表格作为触发ONMOUSEOVER的对象
< /center >< /div >
< div align="center" >< /div >

< div id="yyd0"
//画出6个3X3的不同颜色的层
,就是6个彩色小点
style="position:absolute; left:10px;
top:50px; width:3px; height:3px; z-index:1;
background-color: #33bbaa;
clip: rect(0 3 3 0)" >< /div >< div
id="yyd1"
style="position:absolute; left:20px; top:50px;
width:3px; height:3px; z-index:1; background-color:
#ff2022; clip: rect(0 3 3 0)" >< /div >< div
id="yyd2"
style="position:absolute; left:30px; top:50px;
width:3px; height:3px; z-index:1; background-color:
#cc3399; clip: rect(0 3 3 0)" >< /div >< div
id="yyd3"
style="position:absolute; left:40px; top:50px;
width:3px; height:3px; z-index:1; background-color:
#ffff00; clip: rect(0 3 3 0)" >< /div >< div
id="yyd4"
style="position:absolute; left:50px; top:50px;
width:3px; height:3px; z-index:1; background-color:
#3366cc; clip: rect(0 3 3 0)" >< /div >< div
id="yyd5"
style="position:absolute; left:60px; top:50px;
width:3px; height:3px; z-index:1; background-color:
#5add55; clip: rect(0 3 3 0)" >< /div >
< script >
var yyns4=window.Event?true:false; var mt = 0; var ml = 0;
document.onmousemove = Mousetrace;
tracescript = '';
if (yyns4){ document.captureEvents(Event.MOUSEMOVE);
//获得鼠标移动事件
Mousetrace('',',document.Mousetrace1')}
Layerfx(0,0,'ml+cos((15*sin(yycnt/24.
247212049632708))+0)*150*(sin(10+yycnt/20)+0.2)*
cos(yycnt/20)',
'mt+sin((15*sin(yycnt/36.13878534416527))+0)*
150*(sin(10+yycnt/20)+0.2)*cos(yycnt/20)',
'document.layers[\'yyd0\']',2000,true,80,0,1);
Layerfx(0,0,'ml+cos((15*sin(yycnt/
14.259312736364942))+30)*150*(sin(10+yycnt/20)+0.2)*
cos(yycnt/20)',
'mt+sin((15*sin(yycnt/33.055333176403245))+30)
*150*(sin(10+yycnt/20)+0.2)*cos(yycnt/20)',
'document.layers[\'yyd1\']',2000,true,80,0,1);
Layerfx(0,0,'ml+cos((15*sin(yycnt/
21.77522790563416))+60)*150*(sin(10+yycnt/20)+0.2)*
cos(yycnt/20)',
'mt+sin((15*sin(yycnt/38.00715313644094))+60)
*150*(sin(10+yycnt/20)+0.2)*cos(yycnt/20)','
document.layers[\'yyd2\']',2000,true,80,0,1);
Layerfx(0,0,'ml+cos((15*sin
(yycnt/16.94483476520931))+90)*150*
(sin(10+yycnt/20)+0.2)*cos(yycnt/20)',
'mt+sin((15*sin(yycnt/28.81649093984075))+90)
*150*(sin(10+yycnt/20)+0.2)*cos(yycnt/20)','
document.layers[\'yyd3\']',2000,true,80,0,1);
Layerfx(0,0,'ml+cos((15*sin
(yycnt/13.322848843155297))+120)*150
*(sin(10+yycnt/20)+0.2)*cos(yycnt/20)',
'mt+sin((15*sin(yycnt/13.743055559979211))
+120)*150*(sin(10+yycnt/20)+0.2)*cos(yycnt/20)','
document.layers[\'yyd4\']',2000,true,80,0,1);
Layerfx(0,0,'ml+cos((15*sin
(yycnt/31.727090784502128))+150)*150*
(sin(10+yycnt/20)+0.2)*cos(yycnt/20)',
'mt+sin((15*sin(yycnt/12.66553778007537))
+150)*150*(sin(10+yycnt/20)+0.2)*cos(yycnt/20)'
,'document.layers[\'yyd5\']',2000,true,80,0,1);
//根据层新的坐标重新画层
< /script >
< /body >
< html >

因为这段MOUSE TRACE源代码是分享(DIV)了一个全屏幕的表格,还有跟随鼠标的各层是独立且透明,各位朋友很容易就可以在自己的已经编好的网页上加入鼠标跟随,而不影响原来网页的内容。