<!--
* @Author: web.王建平
* @Date: 2022-11-16 10:10:36
* @LastEditors: web.王建平
* @LastEditTime: 2022-11-18 15:19:36
* @Description: file content
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="box">
<!-- <img src="./img/5.jpg" draggable="true" class="item_list"></img>
<img src="./img/2.jpg" draggable="true" class="item_list"></img>
<img src="./img/7.jpg" draggable="true" class="item_list"></img>
<img src="./img/3.jpg" draggable="true" class="item_list"></img>
<img src="./img/1.jpg" draggable="true" class="item_list"></img>
<img src="./img/4.jpg" draggable="true" class="item_list"></img>
<img src="./img/9.jpg" draggable="true" class="item_list"></img>
<img src="./img/8.jpg" draggable="true" class="item_list"></img>
<img src="./img/6.jpg" draggable="true" class="item_list"></img> -->
<img src="./img/bm.png" draggable="true" class="item_list"></img>
<img src="./img/bm.png" draggable="true" class="item_list"></img>
<img src="./img/bm.png" draggable="true" class="item_list"></img>
<img src="./img/bm.png" draggable="true" class="item_list"></img>
<img src="./img/bm.png" draggable="true" class="item_list"></img>
<img src="./img/bm.png" draggable="true" class="item_list"></img>
<img src="./img/bm.png" draggable="true" class="item_list"></img>
<img src="./img/bm.png" draggable="true" class="item_list"></img>
<img src="./img/bm.png" draggable="true" class="item_list"></img>
</div>
<script src="./flip.js"></script>
<script src="./index.js"></script>
</body>
</html>
<style>
body {
height: calc(60vh - 20px);
display: flex;
justify-content: center;
align-items: center;
background: rgb(40, 44, 52);
}
.box {
width: 252px;
padding: 2px 0px 3px 3px;
display: flex;
flex-wrap: wrap;
background: rgb(4, 91, 98);
border-radius: 5px;
overflow: hidden;
}
.item_list {
width: 80px;
background-color: rgba(4, 91, 98);
border: 1px solid rgb(4, 91, 98);
height: 80px;
margin-top: 2px;
border-radius: 5px;
user-select: none;
cursor: move;
margin-right: 2px;
}
.item_list.moving {
background: transparent;
color: transparent;
border: 1px dashed #ccc;
}
</style>
纵享丝滑拖拽拼图小游戏
需积分: 12 30 浏览量
2022-11-18
16:23:32
上传
评论
收藏 346KB ZIP 举报
drag.zip （13个子文件） 
index.js 2KB
img 
8.jpg 31KB
bm.png 537B 2.jpg 21KB 1.jpg 48KB 6.jpg 44KB 3.jpg 32KB 5.jpg 56KB 4.jpg 48KB 9.jpg 34KB 7.jpg 33KB
index.html 3KB flip.js 2KB资源评论
