有方向的运动js-白红宇

有方向的运动js

阅读量：6819 次

发布时间：2019-06-26

本文共 1088 字，大约阅读时间需要 3 分钟。

<!doctype html>

<head>

<title>derective sport</title>

#eyes{width:200px;height:300px;position: absolute;left:500px;top:200px;text-align: center;background:url(../images/eye.png) no-repeat;}

#leye{border:2px solid blue;position: absolute;left:115px;top:41px;border-radius: 50%;}

#reye{border:2px solid blue;position: absolute;left:135px;top:41px;border-radius: 50%;}

</style>

window.οnlοad=function(){

var r=4;

var oLeye=document.getElementById('leye');

var oReye=document.getElementById('reye');

document.οnmοusemοve=function(ev){

var ev=ev||event;

sport(oLeye,115,41);

sport(oReye,135,41);

function sport(obj,L,T){

var a=ev.clientY-(obj.offsetTop+obj.parentNode.offsetTop);

var b=ev.clientX-(obj.offsetLeft+obj.parentNode.offsetLeft);

var sportX=Math.sin(Math.atan2(b,a))*r;

var sportY=Math.cos(Math.atan2(b,a))*r;

obj.style.left=L+sportX+'px';

obj.style.top=T+sportY+'px';

}

</script>

</head>

<body>

</div>

</body>

</html>

转载地址：http://ntszl.baihongyu.com/

你可能感兴趣的文章