碰撞运动 crash.html

来源:互联网 发布:知乎 swatch秒针掉了 编辑:程序博客网 时间:2024/06/05 03:34
<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title>    <style>        #div1{width:100px;height:100px;background: red;position:absolute;}    </style>    <script>        function startMove(){            var oDiv=document.getElementById('div1');            var iSpeedX=30;            var iSpeedY=8;            setInterval(function(){                iSpeedY+=3;                var l=oDiv.offsetLeft+iSpeedX;                var t=oDiv.offsetTop+iSpeedY;                if(t>=document.documentElement.clientHeight-oDiv.offsetHeight){                    iSpeedY*=-0.8;                    iSpeedX*=0.8;                    t=document.documentElement.clientHeight-oDiv.offsetHeight;                }else if(t<=0){                    iSpeedY*=-1;                    iSpeedX*=0.8;                    t=0;                }                if(l>=document.documentElement.clientWidth-oDiv.offsetWidth){                    iSpeedX*=-0.8;                    l=document.documentElement.clientWidth-oDiv.offsetWidth;                }else if(l<=0){                    iSpeedX*=-0.8;                    l=0;                }                if(Math.abs(iSpeedX)<1){                    iSpeedX=0;                }                if(Math.abs(iSpeedY)<1){                    iSpeedY=0;                }                oDiv.style.left=l+'px';                oDiv.style.top=t+'px';            },30);        }    </script></head><body><input id="ipt1" type="button" value="开始运动" onclick="startMove()"><div id="div1"></div></body></html>
1 0