javascript制作照片墙及制作过程中出现的问题
(编辑：jimmy 日期: 2026/3/1 浏览：3 次 )
本文主要做了一个照片墙，整个制作过程，主要需要解决一下几个问题：
1、如何进行布局转换？
2、如何对图片进行拖拽处理？
3、如何检测图片碰撞问题？进行碰撞检测
4、当多个图片进行碰撞，如何取其中距离对象最小的物体？
5、如何将相互碰撞的两个物体的位置相互交换？涉及到运动的类库
代码如下：
<html>
<head>
<style>
body{background:black;margin: 0;padding: 0;color: white;font-size: 50px;}
p{position: absolute;width:20px;margin-left: 50px;}
#ul1{width: 690px;position: relative;margin: 20px auto;}
#ul1 li{list-style: none;float: left;margin: 10px;width: 200px;height: 150px;z-index: 1;border: 5px solid white;}
#ul1 .active{border: 5px solid yellow;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="/UploadFiles/2021-04-02/move2.js">
以上就是本文的全部内容，希望对大家的学习有所帮助。
下一篇：javascript拖拽效果延伸学习