Commit 8ac49da4 authored by liuqing's avatar liuqing

平面图

parent 9f8f09fe
...@@ -5,7 +5,17 @@ ...@@ -5,7 +5,17 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>监区平面图</title> <title>监区平面图</title>
<script src="../static/js/flexible.js"></script> <script src="../static/js/flexible.js"></script>
<script src="../static/js/jquery-1.8.1.min.js" type=text/javascript></script>
<link rel="stylesheet" href="../static/css/common.css"> <link rel="stylesheet" href="../static/css/common.css">
<script>
$(document).ready(function() {
$("ul li").mouseenter(function() {
$(this).find("img").css("transform", "scale(1.03)"); /* 鼠标进入时将图片放大为1.2倍 */
}).mouseleave(function() {
$(this).find("img").css("transform", "scale(1)"); /* 鼠标离开时恢复图片原始大小 */
});
});
</script>
</head> </head>
<body> <body>
<div class="container"> <div class="container">
...@@ -98,30 +108,35 @@ ...@@ -98,30 +108,35 @@
<ul> <ul>
<li class="a_floor"> <li class="a_floor">
<a href="#"> <img src="../static/images/A_floor.png"/></a> <a href="#"> <img src="../static/images/A_floor.png"/></a>
<span>A栋</span>
</li> </li>
<li class="bg1_floor"> <li class="bg1_floor">
<a href="#"> <img src="../static/images/bgq_floor.png"/></a> <a href="#"> <img src="../static/images/bgq_floor.png"/></a>
<span>办公楼</span>
</li> </li>
<li class="b_floor"> <li class="b_floor">
<a href="#"> <img src="../static/images/B_floor.png"/></a> <a href="#"> <img src="../static/images/B_floor.png"/></a>
<span>B栋</span>
</li> </li>
<li class="g_floor"> <li class="g_floor">
<a href="#"> <img src="../static/images/G_floor.png"/></a> <a href="#"> <img src="../static/images/G_floor.png"/></a>
<span>G栋</span>
</li> </li>
<li class="c_floor"> <li class="c_floor">
<a href="#"> <img src="../static/images/C_floor.png"/></a> <a href="#"> <img src="../static/images/C_floor.png"/></a>
<span>C栋</span>
</li> </li>
<li class="e_floor"> <li class="e_floor">
<a href="#"> <img src="../static/images/E_floor.png"/></a> <a href="#"> <img src="../static/images/E_floor.png"/></a>
</li> <span>E栋</span>
<li class="d_floor">
<a href="#"> <img src="../static/images/D_floor.png"/></a>
</li> </li>
<li class="d_floor_index"> <li class="d_floor_index">
<a href="#"> <img src="../static/images/D_floor_1.png"/></a> <a href="#"> <img src="../static/images/D_floor_1.png"/></a>
<span>D栋</span>
</li> </li>
<li class="f_floor"> <li class="f_floor">
<a href="#"> <img src="../static/images/F_floor.png"/></a> <a href="#"> <img src="../static/images/F_floor.png"/></a>
<span>F栋</span>
</li> </li>
<!-- <li class="h_floor"> <!-- <li class="h_floor">
<a href="#"> <img src="../static/images/F_floor.png"/></a> <a href="#"> <img src="../static/images/F_floor.png"/></a>
......
...@@ -162,6 +162,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -162,6 +162,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
position: absolute; position: absolute;
} }
.area-right ul li span{
position: fixed;
font-size: 0.6rem;
}
.area-right ul .a_floor img{ .area-right ul .a_floor img{
width: 12.6rem; width: 12.6rem;
} }
...@@ -169,6 +173,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -169,6 +173,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
left: 3.9rem; left: 3.9rem;
top: 3rem; top: 3rem;
} }
.area-right ul .a_floor span{
left: 26rem;
top: 7rem;
}
.area-right ul .bg1_floor img{ .area-right ul .bg1_floor img{
width: 16rem; width: 16rem;
} }
...@@ -176,6 +184,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -176,6 +184,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
left: 4rem; left: 4rem;
top: 4.6rem; top: 4.6rem;
} }
.area-right ul .bg1_floor span{
left: 30.7rem;
top:8.4rem;
}
.area-right ul .b_floor img{ .area-right ul .b_floor img{
width: 5rem; width: 5rem;
} }
...@@ -183,6 +195,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -183,6 +195,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
left: 4rem; left: 4rem;
top: 7.8rem; top: 7.8rem;
} }
.area-right ul .b_floor span{
left: 20rem;
top: 13.6rem;
}
.area-right ul .b_floor{ .area-right ul .b_floor{
left: 4rem; left: 4rem;
top: 7.8rem; top: 7.8rem;
...@@ -194,6 +210,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -194,6 +210,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
left: 4rem; left: 4rem;
top: 12.2rem; top: 12.2rem;
} }
.area-right ul .g_floor span{
margin-top: 2.5rem;
margin-left: -2.4rem;
}
.area-right ul .c_floor img{ .area-right ul .c_floor img{
width: 7.3rem; width: 7.3rem;
} }
...@@ -201,6 +221,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -201,6 +221,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
left: 13.6rem; left: 13.6rem;
top: 4.2rem; top: 4.2rem;
} }
.area-right ul .c_floor span{
left: 31rem;
top: 11.8rem;
}
.area-right ul .e_floor img{ .area-right ul .e_floor img{
width: 5rem; width: 5rem;
} }
...@@ -209,6 +233,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -209,6 +233,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
left: 15.5rem; left: 15.5rem;
top: 13.5rem; top: 13.5rem;
} }
.area-right ul .e_floor span{
margin-top: 1rem;
margin-left: -1.8rem;
}
.area-right ul .d_floor img{ .area-right ul .d_floor img{
width: 3rem; width: 3rem;
} }
...@@ -216,6 +244,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -216,6 +244,10 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
right: 12rem; right: 12rem;
top: 6rem; top: 6rem;
} }
.area-right ul .d_floor_index span{
margin-top: 5rem;
margin-left: -1.8rem;
}
.area-right ul .f_floor img{ .area-right ul .f_floor img{
width: 5rem; width: 5rem;
} }
...@@ -223,13 +255,17 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;} ...@@ -223,13 +255,17 @@ a:hover,a:active,a:focus{color:#c00;text-decoration:underline;}
right: 2.6rem; right: 2.6rem;
top: 11.7rem; top: 11.7rem;
} }
.area-right ul .f_floor span{
margin-top: 0.6rem;
margin-left: -1.8rem;
}
.area-right ul .d_floor_index img{ .area-right ul .d_floor_index img{
width: 5rem; width: 5rem;
} }
.area-right ul .d_floor_index{ .area-right ul .d_floor_index{
right: 12rem; right: 11rem;
z-index: 1; z-index: 1;
top: 6rem; top: 6.6rem;
} }
/**业务层**/ /**业务层**/
......
static/images/A_floor.png

188 KB | W: | H:

static/images/A_floor.png

186 KB | W: | H:

static/images/A_floor.png
static/images/A_floor.png
static/images/A_floor.png
static/images/A_floor.png
  • 2-up
  • Swipe
  • Onion skin
static/images/B_floor.png

51.8 KB | W: | H:

static/images/B_floor.png

50.4 KB | W: | H:

static/images/B_floor.png
static/images/B_floor.png
static/images/B_floor.png
static/images/B_floor.png
  • 2-up
  • Swipe
  • Onion skin
static/images/C_floor.png

108 KB | W: | H:

static/images/C_floor.png

108 KB | W: | H:

static/images/C_floor.png
static/images/C_floor.png
static/images/C_floor.png
static/images/C_floor.png
  • 2-up
  • Swipe
  • Onion skin
static/images/D_floor_1.png

67.6 KB | W: | H:

static/images/D_floor_1.png

66.7 KB | W: | H:

static/images/D_floor_1.png
static/images/D_floor_1.png
static/images/D_floor_1.png
static/images/D_floor_1.png
  • 2-up
  • Swipe
  • Onion skin
static/images/E_floor.png

46.3 KB | W: | H:

static/images/E_floor.png

45.2 KB | W: | H:

static/images/E_floor.png
static/images/E_floor.png
static/images/E_floor.png
static/images/E_floor.png
  • 2-up
  • Swipe
  • Onion skin
static/images/F_floor.png

36.7 KB | W: | H:

static/images/F_floor.png

36.9 KB | W: | H:

static/images/F_floor.png
static/images/F_floor.png
static/images/F_floor.png
static/images/F_floor.png
  • 2-up
  • Swipe
  • Onion skin
static/images/G_floor.png

109 KB | W: | H:

static/images/G_floor.png

107 KB | W: | H:

static/images/G_floor.png
static/images/G_floor.png
static/images/G_floor.png
static/images/G_floor.png
  • 2-up
  • Swipe
  • Onion skin
static/images/bgq_floor.png

81.6 KB | W: | H:

static/images/bgq_floor.png

78.5 KB | W: | H:

static/images/bgq_floor.png
static/images/bgq_floor.png
static/images/bgq_floor.png
static/images/bgq_floor.png
  • 2-up
  • Swipe
  • Onion skin
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