这篇文章主要为大家详细介绍了射流研究…实现碰撞检测，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了射流研究…实现碰撞检测的具体代码，供大家参考，具体内容如下

代码：

！声明文档类型

html lang='en '

头

meta charset='UTF-8 '

元名称='视口'内容='宽度=设备宽度，初始比例=1.0 '

标题文档/标题

/head

风格

div {

绝对位置：

top: 0px

right: 0px

bottom: 0px

left: 0px

margin:自动

宽度： 300px

高度： 300px

背景颜色：绿色；

}

span {

绝对位置：

top: 0px

left: 0px

显示器：块；

宽度： 100 px

高度： 100px

背景-color: rgb(10，151，233)；

}

/style

身体

div/div

跨度/跨度

剧本

var div=文档。GetElementsBytagName(' div ')[0]；

var span=文档。GetElementsBytagName(' span ')[0]；

span.onmousedown=function(e) {

//事件对象兼容

e=window.event | | e

//添加全局捕获

if (span.setCapture) {

跨度。setCapture()；

}

//鼠标按下获取鼠标距离页面左侧和顶部距离

var x=e.clientX

var y=e.clientY

//元素距离页面左侧和顶部距离

var elex=span.offsetLeft

var eley=span.offsetTop

//鼠标距离元素距离=鼠标距离页面距离-元素距离页面距离

var X=X-elex；

var Y=Y-eley；

文件。onmousemove=function(e){

//鼠标移动获取鼠标距离页面距离

//事件对象兼容

e=window.event | | e

var movex=e.clientX

var movey=e.clientY

//元素的左边的和顶部值=鼠标距离页面距离-鼠标距离元素距离

var左X=movex-X；

var lefty=唐山网站优化movey-Y；

/* - */

//碰撞检测

//1.左侧安全距离=大盒子距离页面左侧距离-小盒子占位宽

var safe left=div。offsetleft-span。offsetwidth

//2.右侧安全距离大盒子距离页面左侧距离大盒子占位宽

var safe right=div。offsetleft div。offsetidth

//3.上侧安全距离=大盒子距离页面顶部距离-小盒子占位高

var safe top=div。偏移顶部跨度。抵消重量；