<!DOCTYPE >
|
|
<html>
|
<head>
|
<meta charset="utf-8" />
|
<title>信息弹窗</title>
|
|
<style>
|
.box {
|
padding: 20px;
|
width: 90%;
|
|
background: url('./UE/img/background.png') no-repeat center;
|
background-size: 100% 100%;
|
position: absolute;
|
padding: 1%;
|
float: left;
|
}
|
|
.BoxOne {
|
float: left;
|
padding: 5px;
|
width: 98%;
|
/* height: 32px; */
|
|
line-height: 40px;
|
margin: 5px;
|
}
|
|
.titleOne {
|
font-family: 'JDLangZhengTi';
|
font-style: normal;
|
font-weight: bolder;
|
font-size: 25px;
|
line-height: 30px;
|
color: #ffffff;
|
float: left;
|
}
|
|
.titleTwo {
|
font-family: 'JDLangZhengTi';
|
font-style: normal;
|
font-weight: bolder;
|
font-size: 25px;
|
line-height: 22px;
|
color: #00ffcb;
|
}
|
|
.titleThree {
|
font-family: 'JDLangZhengTi';
|
font-style: normal;
|
font-weight: bolder;
|
line-height: 25px;
|
font-size: 30px;
|
color: #ffffff;
|
}
|
|
.titleFour {
|
font-family: 'JDLangZhengTi';
|
font-style: normal;
|
font-weight: bolder;
|
font-size: 25px;
|
line-height: 15px;
|
color: #ffffff;
|
float: left;
|
}
|
</style>
|
<script>
|
function getQueryString(name) {
|
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i')
|
var r = window.location.search.substr(1).match(reg)
|
if (r != null) {
|
return decodeURI(r[2])
|
}
|
|
return ''
|
}
|
|
window.onload = function () {
|
var arr = ['name', 'mode', 'unit', 'output', 'usage', 'rate', 'num']
|
for (var i = 0, c = arr.length; i < c; i++) {
|
document.getElementById(arr[i]).innerHTML = getQueryString(arr[i])
|
}
|
}
|
</script>
|
</head>
|
|
<body>
|
<div class="box">
|
<div class="BoxOne">
|
<div id="name" class="titleOne headOne">北工大软件园•荣京道</div>
|
<div class="titleThree" style="float: right; margin-right: 20px">
|
亿元
|
</div>
|
<div id="output" class="titleTwo" style="float: right">326.7</div>
|
</div>
|
<div class="BoxOne">
|
<div class="titleFour" style="width: 50%">入住企业数量</div>
|
<div class="titleFour" style="width: 50%">楼宇空置率</div>
|
</div>
|
<div class="BoxOne">
|
<div class="titleOne" style="width: 50%">
|
<div id="rate" class="titleTwo" style="float: left">32</div>
|
<div class="titleThree" style="float: left">家</div>
|
</div>
|
<div class="titleOne" style="width: 50%">
|
<div id="num" class="titleTwo" style="float: left">54</div>
|
<div class="titleThree" style="float: left">%</div>
|
</div>
|
</div>
|
<div class="BoxOne">
|
<div class="titleFour" style="width: 50%">用地性质</div>
|
<div class="titleFour" style="width: 50%">经营方式</div>
|
</div>
|
<div class="BoxOne">
|
<div class="titleOne" style="width: 50%">
|
<div class="titleTwo" style="float: left"></div>
|
<div id="usage" class="titleTwo" style="float: left">
|
商业金融业用地/信托投资
|
</div>
|
</div>
|
<div class="titleOne" style="width: 50%">
|
<div id="mode" class="titleTwo" style="float: left">出租</div>
|
</div>
|
</div>
|
<div class="BoxOne">
|
<div class="titleFour" style="color: rgba(255, 255, 255, 0.65)">
|
开发单位
|
</div>
|
<div id="unit" class="titleFour" style="width: 70%">
|
北京经开张湾置业有限公司
|
</div>
|
</div>
|
</div>
|
</body>
|
</html>
|
