会议OA之会议排座&送审

小朱爱编程

已于 2022-07-26 10:51:34 修改

阅读量204

点赞数

文章标签： html javascript css

于 2022-07-26 10:51:32 首次发布

本文链接：https://blog.csdn.net/m0_67477525/article/details/125981113

版权

最近这段时间一直都在与大家分享会议OA项目，今天继续分享关于会议OA项目的一个亮点功能，会议排座。以及一个送审功能。

一、会议排座

二、送审

最近这段时间一直都在与大家分享会议OA项目，今天继续分享关于会议OA项目的一个亮点功能，会议排座。以及一个送审功能。

一、会议排座

1、会议排座插件

为了实现会议排座功能，我们需要再网上寻找一个会议排座的插件。可以上百度搜索

在网上找到的一个插件，但是发现了以下两个问题：

①、发现元素重叠，无法判定有几个人参会 ②、元素块太小看不清

所以我们不能直接使用素材，需要改造以适用于我们的项目

改造后：

源代码：


<html>

	<head>

		<title>会议座位安排</title>

		<style type="text/css">
			* {
				padding: 0;
				margin: 0;
			}

			.tips {
				/* position: absolute; */
				background: #eee;
				display: inline-block;
				height: 60px;
				width: 60px;
				line-height: 60px;
				text-align: center;
				margin: 5px;
			}

			.add {
				position: fixed;
				right: 0;
				top: 0
			}

			#tu {
				width: 564px;
				height: 330px;
				background: lightblue
					/*background: url('u=3318199716,2583790385&fm=26&gp=0.jpg');*/
			}
		</style>
		<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.5.1.min.js"></script>
		<script type="text/javascript" src="http://html2canvas.hertzen.com/dist/html2canvas.js"></script>
	</head>

	<body>


		<div id="tu"></div>
		<!-- <div class="tips" id="tips1" onmouseover="dragF.drag('tips1');">
			<img src="/images/skinslogo.gif"><br>图片可以拖动</div>
		<div class="tips" id="tips2" onmouseover