JS实现跟随鼠标闪烁转动色块的方法
作者：代码家园 时间：2024-04-16 09:05:21
本文实例讲述了JS实现跟随鼠标闪烁转动色块的方法。分享给大家供大家参考。具体实现方法如下：
<html>
<head>
<title>JS跟随鼠标闪烁转动的色块</title>
</head>
<body>
<script language="JavaScript">
<!--
if (document.all){
colours=new Array('ff0000','00ff00','3366ff','ff00ff','ffa500','ffffff','fff000')
amount=colours.length;
YgetDelay=0,XgetDelay=0,Ydelay=0,Xdelay=0,step=0.2,currStep=0,my=0,mx=0;
document.write('<div id="ie" style="position:absolute;top:0;left:0;"><div style="position:relative">');
for (i=0; i < amount; i++)
document.write('<div id="iestars" style="position:absolute;top:0px;left:0px;height:50px;width:50px;font-family:Courier New;font-size:5px;color:'+colours[i]+';padding-top:20px;text-align:center">.</div>');
document.write('</div></div>');
ini=1;
gstep=1;
function iMouse(){
my=event.y;mx=event.x;
}
document.onmousemove=iMouse
function dim(){
ini-=gstep;
dt=setTimeout('dim()',10);
if (ini < 2){
clearTimeout(dt);
glow();
}
}
function glow(){
ini+=gstep;
gt=setTimeout('glow()',10);
if (ini > 14){
clearTimeout(gt);
dim();
}
}
function stars(){
ie.style.top=document.body.scrollTop;
for (i=0; i < amount; i++)
{
var layer=iestars[i].style;
layer.filter='glow(color='+colours[i]+', strength='+ini+')';
layer.top= Ydelay+100*Math.sin((5*Math.sin((currStep-15.99)/10))+i*70)*Math.sin((currStep)/10)*Math.cos((currStep+i*25)/10);
layer.left=Xdelay+180*Math.cos((5*Math.sin((currStep-15.99)/10))+i*70)*Math.sin((currStep)/10)*Math.cos((currStep+i*25)/10);
}
currStep+=step;
}
function delay(){
Ydelay = YgetDelay+=(my-YgetDelay)*1/20;
Xdelay = XgetDelay+=(mx-XgetDelay)*1/20;
stars();
setTimeout('delay()',10);
}
delay();
glow();
}
//-->
</script>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。
标签：JS,鼠标,转动,方法
0
投稿猜你喜欢
python计算方程式根的方法
2023-08-09 09:54:47
python select.select模块通信全过程解析
2022-05-23 13:13:10
几个ASP字符串处理函数
2008-04-23 12:55:00
mint-ui在vue中的使用示例
2023-07-02 16:52:17
Python OpenCV Hough直线检测算法的原理实现
2021-01-29 10:10:00
就 CSS3 向 Eric Meyer 请教的 6 个问题
2008-12-29 13:52:00
CentOS 6.5下安装Python 3.5.2（与Python2并存）
2021-06-24 04:33:54
基于Django框架的rest_framework的身份验证和权限解析
2021-02-21 23:42:58
Python优化技巧之利用ctypes提高执行速度
2022-01-26 09:13:04
Python实现截屏的函数
2023-05-19 11:16:06
彻底搞懂MySQL存储过程和函数
2024-01-24 10:48:52
python查看微信好友是否删除自己
2021-01-31 23:16:32
Yii配置文件用法详解
2024-05-11 09:55:39
windows下mysql忘记root密码的解决方法
2024-01-13 05:05:28
win10安装tensorflow-gpu1.8.0详细完整步骤
2023-01-22 08:44:33
如何用css制作有趣的按钮
2008-03-17 13:54:00
Django 登陆验证码和中间件的实现
2021-08-12 10:26:18
pytorch 实现多个Dataloader同时训练
2023-11-14 23:33:21
界面内容优化的层次
2007-11-06 13:07:00
该死的IE，走好
2009-01-15 12:26:00
