网站首页
|
业界新闻
|
建站指南
|
网页制作
|
动画制作
|
网页特效
|
网络编程
|
书籍教程
|
网页素材
|
视频教程
当前位置:
网页教学网
>>
网页特效
>>
鼠标事件特效
>> 阅读:三色游动光束鼠标效果!
[
HTML
] [
FW
] [
DW
] [
FP
] [
JS
] [
XML
] [
CSS
] [
图象
] [
FLASH
] [
.NET
] [
ASP
] [
JSP
] [
PHP
] [
数据
] [
系统
] [
安全
] [
素材
] [
建站
] [
主机
] [
入门
] [
技巧
]
三色游动光束鼠标效果!
http://www.webjx.com 更新日期:2005-02-24 10:58 出处:网页教学网 作者:
有什么问题请到<a href='/bbs/forums.php?fid=21'>论坛</a>中发表<br> <!-- http://www.webjx.com/ --> <!-- http://bbs.webjx.com/ --> <!--完成此特效需要2步 第一步:把下面代码放到<head>区域中--> <script language="JavaScript"> var a_Colour='ff0000'; var b_Colour='00ff00'; var c_Colour='0000ff'; var Size=50; var YDummy=new Array(),XDummy=new Array(),xpos=0,ypos=0,ThisStep=0;step=0.03; 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.cos(ThisStep+i*2)*Math.sin((ThisStep)*6); XDummy[i]=xpos+Size*Math.sin(ThisStep+i*2)*Math.sin((ThisStep)*6); } 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>区域中--> <body bgcolor="#000000">
[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
关键词:
【
推荐给好友
】【
关闭
】【
收藏本文
】
最新五条评论
查看全部评论
评论总数
0
条
您的评论
用户名:
(
新注册
) 密 码:
匿名:
·用户发表意见仅代表其个人意见,并且承担一切因发表内容引起的纠纷和责任
·本站管理人员有权在不通知用户的情况下删除不符合规定的评论信息或留做证据
·请客观的评价您所看到的资讯,提倡就事论事,杜绝漫骂和人身攻击等不文明行为
站内搜索
标题
作者
内容
热门关键字:
HTML
CSS
网页
动画
Photoshop
Web标准
Web黑客
优化
入门
非主流
照片处理
相关文章
推荐文章
Photoshop让花卉照片更加清晰嫩绿
用Photoshop去除照片中文字的几个基本技法
Photoshop鼠绘教程:苹果绘制全过程
Photoshop神功再现:抠出墨的流动效果
用DW制作网页时关于文字自动换行的小技巧
买完正版Vista机型却要改装盗版XP的悲哀
照片处理 Photoshop打造真实的铅笔素描画
Photoshop照片合成实例教程:为照片添加烟花
Photoshop制作用图片填充图片的错觉效果
完美曲线:Photoshop打造靓丽美女
Photoshop把照片制作成泛黄色陈旧效果
Photoshop简单把照片处理为逼真水彩画
热点资讯
如何写robots.txt,关于robots.txt的制作
简简单单两步法 誓把天下流氓都拉下马
恢复被破坏的Windows XP系统文件的操作方法
策划设计制作网站应该注意的九大原则
五大注意事项 防止系统重装时遭遇病毒
找准病毒“落脚点”从系统中剔除病毒
Windows Vista操作系统复选框功能试用
Photoshop老片新调:让模糊照片变清晰
利用Photoshop曲线和抽出简单几步扣图法
Photoshop调色教程 偏色宝宝照片肤色调整
网页菜单特效 通用的三级联动菜单
运用Mysql语句生成后门木马的具体方法