碰撞运动

最新推荐文章于 2018-10-29 15:53:36 发布

陆康永

最新推荐文章于 2018-10-29 15:53:36 发布

阅读量758

点赞数

分类专栏： miaov运动学之弹性运动及碰撞运动

本文链接：https://blog.csdn.net/xiaomogg/article/details/45306821

版权

miaov运动学之弹性运动及碰撞运动专栏收录该内容

7 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#div1{width:100px;height:100px;background:red;position: absolute;}
</style>
<script type="text/javascript">
window.οnlοad=function()
{
var oDiv=document.getElementById("div1");
var disX=0;
var disY=0;
var prevX=0;
var prevY=0;
var iSpeedX=0;//最后的X速度
var iSpeedY=0;//最后的Y速度

oDiv.οnmοusedοwn=function()
{
var ev=ev||event;

disX=ev.clientX-oDiv.offsetLeft;
disY=ev.clientY-oDiv.offsetTop;
prevX=ev.clientX;
prevY=ev.clientY;
document.οnmοusemοve=function()
{
var ev=ev||event;
oDiv.style.left=ev.clientX-disX+"px";
oDiv.style.top=ev.clientY-disY+"px";
iSpeedX=ev.clientX-prevX;//获取最后一次移动的速度
iSpeedY=ev.clientY-prevY;
//制作时间差,重新获取
prevX=ev.clientX;
prevY=ev.clientY;
startMove(oDiv);
};
document.οnmοuseup=function()
{
document.οnmοusemοve=null;
document.οnmοuseup=null;
};
return false;
};
function startMove(obj)
{
clearInterval(obj.timer);
obj.timer=setInterval(function()
{
iSpeedY+=3;//这里是重力
var L=obj.offsetLeft+iSpeedX;
var T=obj.offsetTop+iSpeedY;
if(T>document.documentElement.clientHeight-obj.offsetHeight)
{
T=document.documentElement.clientHeight-obj.offsetHeight;
iSpeedY*=-1;
iSpeedY*=0.75;//摩擦力
iSpeedX*=0.75;//摩擦力
}
else if(T<0)
{
T=0;
iSpeedY*=-1;
iSpeedY*=0.75;//摩擦力
}
if(L>document.documentElement.clientWidth-obj.offsetWidth)
{
L=document.documentElement.clientWidth-obj.offsetWidth;
iSpeedX*=-1;

}
else if(L<0)
{
L=0;
iSpeedX*=-1;

}
obj.style.left=L+"px";
obj.style.top=T+"px";
},30)
}
}

</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>

陆康永

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
碰撞运动

#div1{width:100px;height:100px;background:red;position: absolute;} window.onload=function() { var oDiv=document.getElementById("div1"); var dis
复制链接

扫一扫