下面是我给大家整理的原生js实现判断碰撞的方法，有兴趣的同学可以去看看。
HTML页面代码：
登录后复制
CSS页面代码：
* { padding: 0px; margin: 0px; } #d1{ width: 100px; height: 100px; background: red; position: absolute; } #d2{ width: 200px; height: 200px; background: yellow; position: absolute; top: 200px; left: 400px; position: absolute; }
登录后复制
JS页面代码：
div=document.querySelectorAll("div"); function hit(obj){ obj.onmousedown=function(e){ var e=e||window.event; var dX=e.offsetX; var dY=e.offsetY; document.onmousemove=function(e){ var x=e.clientX; var y=e.clientY; obj.style.left=x-dX+"px"; obj.style.top=y-dY+"px"; if(div[0].offsetTop+div[0].offsetHeight>=div[1].offsetTop && div[0].offsetTop=div[1].offsetLeft && div[0].offsetLeft<=div[1].offsetLeft+div[1].offsetWidth){ console.log("你撞我了！再撞一个试试！") }; } document.onmouseup=function(){ document.onmousemove=null; } } } hit(div[0]); hit(div[1]);
登录后复制
上面是我整理给大家的原生JS实现判断碰撞的方法，希望今后会对大家有帮助。
相关文章：
JS下载文件流的简单操作（附上代码）
在js中生成验证码并验证(含有代码，简单粗暴，包教包会)
有关在JS 获取JSON数据简单调用（代码附上，简单粗暴）
以上就是原生JS实现判断碰撞的方法（趣味实例）的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2761319.html
