zoukankan      html  css  js  c++  java
  • 有方向的运动js

    <!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>derective sport</title>
        <style type="text/css">
            #eyes{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>
        <script type="text/javascript">
            window.onload=function(){
                var r=4;
                var oLeye=document.getElementById('leye');
                var oReye=document.getElementById('reye');
                document.onmousemove=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 id="eyes">
            <span id="leye"></span>            
            <span id="reye"></span>
        </div>
    </body>
    </html>
  • 相关阅读:
    关于学习
    两个有序链表序列的合并
    谜题 UVA227
    周期串(Periodic Strings, UVa455)
    数数字(Digit Counting,ACM/ICPC Danang 2007,UVa1225)
    得分(Score, ACM/ICPC Seoul 2005,UVa 1585)
    201505061055_《Javascript编码规范笔记》
    201505031734_《JavaScript中的函数》
    201505030956_《Javascript变量整理》
    201505022013_《js好的坏的》
  • 原文地址:https://www.cnblogs.com/zhchoutai/p/8615100.html
Copyright © 2011-2022 走看看