<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Demo</title>
<script src="jquery.min.js"></script>
<style>
.drag {
/*border: 1px #d3dbde solid;*/
position: absolute;
/*width: 800px;*/
/*height: 400px;*/
/*background: #F2F6F8;*/
padding: 15px;
top: 188px;
left: 280px;
cursor: move;
z-index: 1000;
}
table {
width: 800px;
border-top: 1px solid #d3dbde;
border-right: 1px solid #d3dbde;
}
th {
height: 37px;
line-height: 37px;
border-left: 1px solid #d3dbde;
background-color: #F2F6F8;
border-bottom: 1px solid #d3dbde;
}
td {
border-bottom: 1px solid #d3dbde;
border-left: 1px solid #d3dbde;
padding: 5px;
text-indent: 5px;
text-align: center;
vertical-align: middle;
text-align: left;
}
.input-text {
border: 1px solid #bac7d2;
background: #f7fcfe; /* #f7fcfe #f3fafd*/
border-radius: 2px;
box-shadow: 2px 2px 2px #e7f1f7 inset;
padding-left: 8px;
height: 30px;
width: 280px;
}
.input-text2 {
border: 1px solid #bac7d2;
bac
js拖拽效果 (制作模板)
最新推荐文章于 2024-01-08 20:56:19 发布
这篇博客演示了如何使用JavaScript创建一个可拖动的元素。通过添加事件监听器,实现鼠标按下、移动和释放时元素的移动效果。此外,代码还包含了一个简单的HTML表单,用于生成新的可拖动元素,并提供了保存所有拖动元素布局的功能。
摘要由CSDN通过智能技术生成