【javascript动画之圆形运动】环绕鼠标运动作小球(兼容ie,ff,chrome,……)

原创文章，转载请注明出处：http://www.cnblogs.com/airy/

 

效果看鼠标的周围吧！！

 

代码如下：

 

< 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 = e.clientX + document.documentElement.scrollLeft;
y = e.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 >

 

 

转载于:https://www.cnblogs.com/airy/archive/2010/07/19/1780695.html