Skip to content

J
jianchayuan
Commit d14f8d3e authored by zhangyudan's avatar zhangyudan
Browse files
Options

11

parent f43b3769
Show whitespace changes
Inline Side-by-side
Showing with 304 additions and 1 deletion
index.html
View file @ d14f8d3e
...@@ -6,9 +6,13 @@ ...@@ -6,9 +6,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="static/js/jquery-1.8.1.min.js" type=text/javascript></script> <script src="static/js/jquery-1.8.1.min.js" type=text/javascript></script>
<script src="static/js/flexible.js"></script> <script src="static/js/flexible.js"></script>
<link rel="stylesheet" type="text/css" href="static/css/common.css" />
<title>上海市人民检察院</title> <title>上海市人民检察院</title>
</head> </head>
<style type="text/css"> <style type="text/css">
/* img {
width: 100%;
} */
/* 鼠标悬停时显示的tooltip样式 */ /* 鼠标悬停时显示的tooltip样式 */
.tooltip { .tooltip {
position: absolute; position: absolute;
...@@ -69,7 +73,6 @@ ...@@ -69,7 +73,6 @@
<img src="static/images/index1.png" usemap="#image-map"> <img src="static/images/index1.png" usemap="#image-map">
<map name="image-map"> <map name="image-map">
<area target="" alt="jianzu1" title="jianzu1" href="" coords="588,579,633,641" <area target="" alt="jianzu1" title="jianzu1" href="" coords="588,579,633,641"
onmouseover="showTooltip(event, 'Tooltip for Area 1')" onmouseout="hideTooltip()"
onclick="handleClick(1)" shape="rect"> onclick="handleClick(1)" shape="rect">
<area target="" alt="jianzu2" title="jianzu2" href="" coords="667,565,708,620" onclick="handleClick(2)" <area target="" alt="jianzu2" title="jianzu2" href="" coords="667,565,708,620" onclick="handleClick(2)"
shape="rect"> shape="rect">
......
plandirectory/areaPlan.html 0 → 100644
View file @ d14f8d3e
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>监区平面图</title>
<script src="../static/js/flexible.js"></script>
<link rel="stylesheet" href="../static/css/common.css">
</head>
<body>
<div class="container">
<div class="main-area">
<div class="header-area">
<img src="../static/images/logo_mc.png"/>
</div>
<div class="area-content">
<div class="area-left">
<div class="title">某某测试监区平面图</div>
<div class="left-menu">
<ul>
<li>
<div class="menu-mc">
<span>办公楼</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #ff6363;">35</span>
</div>
</li>
<li>
<div class="menu-mc">
<span>办公楼</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style=" background-color: #ffba00;">35</span>
</div>
</li>
<li>
<div class="menu-mc">
<span>办公楼</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #43e04e;">35</span>
</div>
</li>
<li>
<div class="menu-mc">
<span>办公楼</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style=" background-color: #2f8fff;">35</span>
</div>
</li>
<li>
<div class="menu-mc">
<span>办公楼</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #ff6363;">35</span>
</div>
</li>
<li>
<div class="menu-mc">
<span>办公楼</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #ff8a00;">35</span>
</div>
</li>
<li>
<div class="menu-mc">
<span>办公楼</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #ffba00;">35</span>
</div>
</li>
<li>
<div class="menu-mc">
<span>办公楼</span>
</div>
<div class="menu-num">
<span>监控点</span>
<span style="background-color: #43e04e;">35</span>
</div>
</li>
</ul>
</div>
</div>
<div class="area-right">
1
</div>
</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
static/css/common.css
View file @ d14f8d3e
...@@ -20,6 +20,7 @@ div { ...@@ -20,6 +20,7 @@ div {
border: 0; border: 0;
} }
<<<<<<< HEAD
ul, ul,
ol { ol {
list-style: none; list-style: none;
...@@ -58,3 +59,62 @@ a:focus { ...@@ -58,3 +59,62 @@ a:focus {
.camera { .camera {
position: absolute; position: absolute;
} }
=======
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{margin:0;padding:0;border:0;font-size: 16px;color: #fff;}
ul,ol{list-style:none;}
select,input,img,select{vertical-align:middle;}
a{text-decoration:none;}
a:link{color:#009;}
a:visited{color:#800080;}
a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
.container .main-area{
background: url(../images/home_bj.png) no-repeat;
height: 100vh;
background-size: cover;
}
.header-area{
margin: auto;
text-align: center;
}
.header-area img{
width: 10rem;
height: auto;
padding-top: 1.4rem;
}
.area-content{
margin:1rem 3rem 0 3rem;
}
.area-left{
width: 23%;
float: left;
}
.area-right{
float: right;
width: 75%;
}
.area-content .area-left .title{
font-size: 22px;
text-align: center;
letter-spacing: 1px;
font-family: 'AlibabaPuHuiTi_2_85_Bold';
}
.left-menu ul li{
background-color: #435770ad;
border-radius: 7px;
margin-top: 0.6rem;
display: flex;
justify-content: space-between;
font-size: 18px;
height: 45px;
line-height: 45px;
padding: 0 20px;
}
.left-menu .menu-num span:nth-child(2){
vertical-align: middle;
padding:3px 20px;
border-radius: 13px;
margin-left: 10px
}
>>>>>>> origin/master
static/css/workshop.css 0 → 100644
View file @ d14f8d3e
.padding_box {
padding: 3.5rem 2rem 0;
}
.flex-box {
display: flex;
align-content: center;
justify-content: center;
align-items: center;
}
.menu_box {
width: 10rem;
}
.menu_title_box {
width: 100%;
text-align: center;
font-size: 32px;
color: #fff;
}
.tab_list ul {
display: block;
width: 100%;
}
.tab_list ul li {
color: #fff;
font-weight: normal;
font-size: 16px;
background: rgb(0 35 105 / 70%);
margin: 0.4rem 0;
border-radius: 0.2rem;
line-height: 2rem;
}
.tab_list ul li div {
font-size: 0.6rem;
justify-content: space-around;
}
.monitor {
font-size: 0.5rem;
}
.monitor span {
background: #006aec;
padding: 0.1rem 0.4rem;
border-radius: 2rem;
margin-left: 0.1rem;
}
.tab_list ul li a {
color: #a84c47;
}
.tab_list ul li.current {
line-height: 2rem;
border: none;
background: #006aec;
font-weight: normal;
}
.tab_list ul li.current .monitor span {
background: #0055bd;
}
.content_box {
flex: 1;
}
\ No newline at end of file
static/images/floor.png 0 → 100644
View file @ d14f8d3e
This diff is collapsed.
static/images/home_floor.png 0 → 100644
View file @ d14f8d3e
This diff is collapsed.
workshop.html 0 → 100644
View file @ d14f8d3e
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="static/js/jquery-1.8.1.min.js" type=text/javascript></script>
<script src="static/js/flexible.js"></script>
<link rel="stylesheet" type="text/css" href="static/css/common.css" />
<link rel="stylesheet" type="text/css" href="static/css/workshop.css" />
<title>上海市人民检察院</title>
</head>
<style type="text/css">
.content {
background: url(static/images/workshop_bg.png);
width: 100%;
min-height: 100vh;
background-position-x: center;
}
</style>
<script type="text/javascript">
$(function () {
// 1、点击上面的li，当前点击的li添加current类，其余兄弟移除类
$(".tab_list li").click(function () {
// 链式编程 当前li添加类，其余兄弟移除类
$(this).addClass('current').siblings().removeClass('current');
// 2、拿到当前点击的索引号
var index = $(this).index();
// 3、下面index对应的模块显示，其余的item隐藏
$(".tab_con .item").eq(index).show().siblings().hide();
})
});
</script>
<body>
<div class="content">
<div class="flex-box padding_box">
<div class="menu_box">
<div class="menu_title_box">北车间</div>
<div class="tab_list">
<ul>
<li class="current">
<div class="flex-box">
<p>一楼</p>
<p class="monitor">监控点<span>28</span></p>
</div>
</li>
<li>
<div class="flex-box">
<p>二楼</p>
<p class="monitor">监控点<span>28</span></p>
</div>
</li>
</ul>
</div>
</div>
<div class="content_box">222</div>
</div>
</div>
</body>
</html>
\ 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