手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >javascript动画之圆形运动,环绕鼠标运动作小球
javascript动画之圆形运动,环绕鼠标运动作小球
摘要:代码如下:复制代码代码如下:varball;varmouseX=100;varmouseY=100;varangle=0;varradius...

代码如下:

复制代码 代码如下:

<script type="text/javascript">

var ball;

var mouseX = 100;

var mouseY = 100;

var angle = 0;

var radius = 50;

function run(){

if(ball === undefined){

ball = document.createElement("span");

ball.style.position = "absolute";

ball.style.color = "#FF0000";

ball.style.zIndex = 999999999;

ball.innerHTML = "●";

document.body.appendChild(ball);

}

ball.style["left"] = mouseX+(Math.cos(angle)*radius) + "px";

ball.style["top"] = mouseY+(Math.sin(angle)*radius) + "px";

angle+=0.1;

}

function MousePos(e)

{

e = e || window.event;

var x,y;

if(!document.all){

x = e.pageX;

y = e.pageY;

}

else{

x = event.clientX + document.documentElement.scrollLeft;

y = event.clientY + document.documentElement.scrollTop;

}

return {x:x,y:y};

}

function setXY(e)

{

e = e || window.event;

var pos = MousePos(e);

mouseX = pos.x;

mouseY = pos.y;

}

window.onload = function(){

setInterval(run,20);

document.documentElement.onmousemove = function(e){

e = e || window.event;

setXY(e);

};

}

</script>

作者: cnblogs airy

【javascript动画之圆形运动,环绕鼠标运动作小球】相关文章:

javascript制作的滑动图片菜单

JavaScript模版引擎的基本实现方法浅析

javascript相关事件的几个概念

javaScript中slice函数用法实例分析

JavaScript中用sort()方法对数组元素进行排序的操作

javascript基于DOM实现权限选择实例分析

JavaScript实现鼠标拖动效果的方法

javascript动态创建表格及添加数据实例详解

javascript操作ul中li的方法

JavaScript常用数组算法小结

精品推荐
分类导航