Skip to content

J
jianchayuan
Commit 062fd4b3 authored by liuqing's avatar liuqing
Browse files
Options

Merge branch 'master' of http://180.168.156.211:2903/liuqing/jianchayuan

parents 392bc485 151084fd
Hide whitespace changes
Inline Side-by-side
Showing with 98 additions and 105 deletions
plandirectory/commonmodel.html
View file @ 062fd4b3
......@@ -4,9 +4,13 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/css/bootstrap.min.css" rel="stylesheet">
<script src="../static/js/jquery-1.8.1.min.js" type=text/javascript></script>
<script src="../static/js/rem.js"></script>
<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/popper.min.js"></script>
<script src="../static/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="../static/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="../static/css/modal.css" />
<link rel="stylesheet" type="text/css" href="../static/css/common.css" />
<link rel="stylesheet" type="text/css" href="../static/css/workshop.css" />
<link rel="stylesheet" type="text/css" href="../static/css/commonArea.css" />
......@@ -21,103 +25,6 @@
background-size: cover;
}
/* 修改背景图片 */
.content {
background: url('../static/images/bg.jpg') no-repeat;
width: 100%;
min-height: 100vh;
background-size: cover;
}
/* 修改模态框样式 */
.modal-dialog {
background-image: url("../static/images/tc_bj.png");
/* 替换为你的背景图片路径和名称 */
background-size: cover;
/* 自动适应尺寸并覆盖整个模态框 */
background-repeat: no-repeat;
/* 防止重复平铺 */
width: 75%;
/* 设置模态框宽度为屏幕的一半 */
height: 68vh;
/* 设置模态框高度为屏幕高度的一半 */
max-width: 1200px;
/* 设置最大宽度 */
max-height: 700px;
/* 设置最大高度 */
}
/* 修改模态框样式 */
.modal-content {
background-color: #00254d00;
border: none;
}
.modal-title {
font-family: 'PingFang-SC-Bold';
font-size: 26px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 1px;
color: #ffffff;
}
.modal-body {
display: flex;
padding: 30px;
}
#cameraText {
width: 50%;
/* 修改左侧文字占比 */
padding: 20px;
/* 修改文字内边距 */
}
#cameraText p {
margin-bottom: 10px;
/* 修改段落之间的间距 */
}
#cameraVideo {
width: 50%;
/* 修改右侧视频占比 */
padding: 0 10px;
/* 修改视频内边距 */
}
#cameraVideo video {
width: 100%;
/* 修改视频宽度 */
outline: none;
/* 去掉视频播放器的外边框 */
}
.modal-content .title {
text-align: center;
line-height: 40px;
margin-top: 20px;
font-size: 0.25rem;
}
.modal-body ul {
margin-left: 20px;
margin-top: 10px;
}
.modal-body ul li {
height: 40px;
font-size: 16px;
cursor: pointer;
}
.modal-body ul li span {
margin-left: 10px;
font-size: 0.2rem;
color: #eee;
}
.padding_box {
padding: 0.12rem 0.7rem
}
......@@ -439,7 +346,7 @@
<div class="modal-body">
<!-- 左侧文字 -->
<div style="float:left; width:15%;">
<div style="width:15%;">
<!-- 这里放置动态加载的文本，例如摄像头信息 -->
<ul>
<li><img src="../static/images/sp_icon.png"><span>监控1001</span></li>
......@@ -450,7 +357,7 @@
</ul>
</div>
<!-- 右侧视频 -->
<div style="float:right; width:85%;" id="cameraVideo">
<div style="flex: 1;" id="cameraVideo">
<div id="new_data"></div>
<video width="100%" controls poster="../static/images/sp_model.png">
<source src="视频文件路径/URL" type="video/mp4"> <!-- 修改为你的视频文件路径或URL -->
......@@ -506,11 +413,7 @@
</div>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/popper.js/2.10.2/umd/popper.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/js/bootstrap.min.js"></script>
<script>
<script>
// 关闭模态框
$('#cameraModal').on('hidden.bs.modal', function (e) {
......
static/css/modal.css 0 → 100644
View file @ 062fd4b3
/* 修改模态框样式 */
.modal-dialog {
/* 防止重复平铺 */
width: 75%;
/* 设置模态框宽度为屏幕的一半 */
height: 68vh;
/* 设置模态框高度为屏幕高度的一半 */
max-width: 1200px;
/* 设置最大宽度 */
max-height: 700px;
/* 设置最大高度 */
}
/* 修改模态框样式 */
.modal-content {
background-image: url("../images/tc_bj.png");
/* 替换为你的背景图片路径和名称 */
background-size: cover;
/* 自动适应尺寸并覆盖整个模态框 */
background-repeat: no-repeat;
/* background-color: #00254d00; */
border: none;
background-color: transparent;
}
.modal-title {
font-family: 'PingFang-SC-Bold';
font-size: 26px;
font-weight: normal;
font-stretch: normal;
letter-spacing: 1px;
color: #ffffff;
}
.modal-body {
display: flex;
padding: 30px;
}
#cameraText {
width: 50%;
/* 修改左侧文字占比 */
padding: 20px;
/* 修改文字内边距 */
}
#cameraText p {
margin-bottom: 10px;
/* 修改段落之间的间距 */
}
#cameraVideo {
width: 50%;
/* 修改右侧视频占比 */
padding: 0 10px;
/* 修改视频内边距 */
}
#cameraVideo video {
width: 100%;
/* 修改视频宽度 */
outline: none;
/* 去掉视频播放器的外边框 */
}
.modal-content .title {
text-align: center;
line-height: 40px;
margin-top: 20px;
font-size: 0.25rem;
}
.modal-body ul {
margin-left: 20px;
margin-top: 10px;
}
.modal-body ul li {
height: 40px;
font-size: 16px;
cursor: pointer;
}
.modal-body ul li span {
margin-left: 10px;
font-size: 0.2rem;
color: #eee;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment