碰撞运动 crash.html

原创 2016年08月30日 17:14:36
<!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>
版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

OpenGL 碰撞检测与模型运动

原 文:Lesson 31: Collision Detection and Physically Based Modeling Tutorial 译 者:Wguzgg   下面我们要讨论的是...

用canvas绘制“具有碰撞检测效果的运动五角星”

本文采用canvas绘制了了30个大小随机、运动方向随机、运动速度随机、碰到画布边缘会反弹回来的五角星。

OT源代码的分析,OrtHello 迟早攻破你 (七)第2个例子,碰撞和简单运动

首先记住在main的updata里面,OT的初始化不是放在start中的,而是在update中的,具体做法是: void Update () {         if (!OT.isValid) ...

《MFC游戏开发》笔记九 游戏中的碰撞判定初步&怪物运动简单AI

在游戏之中,碰撞判定是必不可少的一块,在许多地方都需要用到。比如说在即时战斗游戏中,当人物碰到怪物的时候,人物是会扣血的;在回合制中,碰到怪物是要进入战斗场景的;游戏之中也还有一些荆棘之类的东西,还有...

NBUT 1462 台球碰撞(物理运动)

台球碰撞 Description 在平面直角坐标系下,台球桌是一个左下角在(0,0),右上角在(L,W)的矩形。有一个球心在(x,y),半径为R的圆形母球放在台球桌上(整个球都在台球桌...

js实现碰撞运动

XNA 两球碰撞的运动规律

这个学期学XNA,老师给布置一个小的2D游戏。所以就选择了气垫球(Air Hockey)的游戏,并且是可以相互对战的。这里想讨论的是一个求固定不动的,另一个在运动的         然后这个...

nbut 台球碰撞 物理-运动

题目: 台球碰撞 Time Limit: 1000MS   Memory Limit: 65535KB   64bit IO Format:...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)