You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

338 lines
10 KiB

<!DOCTYPE html>
<html>
<head lang="en">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta charset="GBK">
<title>¸£Ó¯¼¯ÍÅ</title>
<link rel="stylesheet" href="css/reset.css"/>
<link rel="stylesheet" href="css/common.css"/>
<link rel="stylesheet" href="css/map.css"/>
</head>
<body>
<div class="all">
<!--<div class="dian"><img src="image/map/mapd.png"/>
</div>-->
<div class="shanxi" id="shanxi"><a href="phb.html" ><img src="image/map/changzhi.png"/></a></div>
<div class="quanzhou" id="quanzhou"><a href="phb.html" ><img src="image/map/quanzhou.png"/></a></div>
<div class="jingzhou" id="jingzhou"><a href="phb.html" ><img src="image/map/jingzhou.png"/></a></div>
<div class="shanghai" id="shanghai"><a href="phb.html" ><img src="image/map/shanghai.png"/></a></div>
<div class="shenyang" id="shenyang"><a href="phb.html" ><img src="image/map/sy.png"/></a></div>
<div class="zibo" id="zibo"><a href="phb.html" ><img src="image/map/zb.png"/></a></div>
<div class="yantai" id="yantai"><a href="phb.html" ><img src="image/map/yt.png"/></a></div>
<div class="nanjing" id="nanjing"><a href="phb.html" ><img src="image/map/nj.png"/></a></div>
<div class="jiangyin" id="jiangyin"><a href="phb.html" ><img src="image/map/jy.png"/></a></div>
<div class="xiangshui" id="xiangshui"><a href="phb.html" ><img src="image/map/xs.png"/></a></div>
<div class="changzhi" id="changzhi"><a href="phb.html" ><img src="image/map/cz.png"/></a></div>
<div class="huian" id="huian"><a href="phb.html" ><img src="image/map/ha.png"/></a></div>
<div class="xiamen" id="xiamen"><a href="phb.html" ><img src="image/map/xm.png"/></a></div>
<div class="jinjiang" id="jinjiang"><a href="phb.html" ><img src="image/map/jj.png"/></a></div>
<div class="tinybox" id="tinybox" style="position:absolute; width:100%; height:120%; background:black;display: none;z-index: 990; ; display:none;text-align:center; padding:10px; fill-opacity: 80;opacity: 0.8;" onclick="h()"> <dt style="color: #6d87a2;font-size: 0.25rem;position: absolute; top:60%;left:30% ">µã»÷ͼƬ²é¿´·ÖÇøÏêÇé</dt>></div>
<div class="metu" style="width: 4.6rem;margin-left: 1.40rem;height: 5.5rem;position:absolute;top:5.80rem;color: #002C5C " >
<div class="fendian" style="width: 100%;height: 4.20rem ; ">
<div class="title" style="font-size:0.22rem;text-align: left; ">&nbsp;&nbsp;&nbsp;&nbsp;·Ö¹«Ë¾°ñµ¥</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="jingzhou()">¾£ÖÝ</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="quanzhou()">ȪÖÝ</div>
<div class="title" style="font-size:0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="shenyang()">ÐÂÃŽÖ</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="shanxi()" >»Ý°²</div>
<div class="title" style="font-size:0.22rem;float: left;width: 45%;text-align: center;line-height:.50rem" onclick="shanxi()">½ú½­</div>
<div class="title" style="font-size:0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="nanjing()">ÄϾ©</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="changzhi()">³¤ÖÎ</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="jiangyin()">½­Òõ</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="zibo()" >×Ͳ©</div>
<div class="title" style="font-size:0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="yantai()">ÑĮ̀</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="xiangshui()">ÏìË®</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .60rem" onclick="xiangshui()">ÑγÇ</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .50rem" onclick="shanxi()">ÏÃÃÅ</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height: .50rem" onclick="shanxi()">ÁÙ×Í</div>
</div>
<div class="chouian" style="width: 100%;height: .60rem ;">
<div class="title" style="font-size:0.22rem;text-align: left; ">&nbsp;&nbsp;&nbsp;&nbsp;×ܹ«Ë¾°ñµ¥</div>
<div class="title" style="font-size: 0.22rem;float: left;width: 45%;text-align: center;line-height:.60rem" onclick="shanghai()">ÉϺ£</div>
</div>
</div>
</div >
<script type="text/javascript" src="js/jquery-2.1.1.min.js?t=2"></script>
<script type="text/javascript" src="js/rem.js"> </script>
<script type="text/javascript">
function shanxi(){
alert("¾´ÇëÆÚ´ý");
}
function quanzhou(){
$("#tinybox").show();
$("#quanzhou").show();
$("#quanzhou img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#quanzhou img").animate({'width':'3.40rem','height':'3.97rem'},1000);
$("#quanzhou").animate({'top':'-13%','left':'-45%'},2000);
}
function jingzhou(){
$("#tinybox").show();
$("#jingzhou").show();
$("#jingzhou img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#jingzhou img").animate({'width':'5.08rem','height':'3.17rem'},1000);
$("#jingzhou").animate({'top':'-13%','left':'-65%'},2000);
}
function shenyang(){
$("#tinybox").show();
$("#shenyang").show();
$("#shenyang img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#shenyang img").animate({'width':'1.98rem','height':'3.12rem'},1000);
$("#shenyang").animate({'top':'-5%','left':'-50%'},2000);
}
function shanghai(){
$("#tinybox").show();
$("#shanghai").show();
$("#shanghai img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#shanghai img").animate({'width':'3.05rem','height':'2.74rem'},1000);
$("#shanghai").animate({'top':'-5%','left':'-50%'},2000);
}
function zibo(){
$("#tinybox").show();
$("#zibo").show();
$("#zibo img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#zibo img").animate({'width':'1.53rem','height':'3.12rem'},1000);
$("#zibo").animate({'top':'-5%','left':'-50%'},2000);
}
function yantai(){
$("#tinybox").show();
$("#yantai").show();
$("#yantai img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#yantai img").animate({'width':'3.12rem','height':'2.27rem'},1000);
$("#yantai").animate({'top':'-5%','left':'-50%'},2000);
}
function nanjing(){
$("#tinybox").show();
$("#nanjing").show();
$("#nanjing img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#nanjing img").animate({'width':'1.84rem','height':'3.12rem'},1000);
$("#nanjing").animate({'top':'-5%','left':'-50%'},2000);
}
function jiangyin(){
$("#tinybox").show();
$("#jiangyin").show();
$("#jiangyin img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#jiangyin img").animate({'width':'3.12rem','height':'1.98rem'},1000);
$("#jiangyin").animate({'top':'-5%','left':'-50%'},2000);
}
function xiangshui(){
$("#tinybox").show();
$("#xiangshui").show();
$("#xiangshui img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#xiangshui img").animate({'width':'3.12rem','height':'2.83rem'},1000);
$("#xiangshui").animate({'top':'-5%','left':'-50%'},2000);
}
function changzhi(){
$("#tinybox").show();
$("#changzhi").show();
$("#changzhi img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#changzhi img").animate({'width':'1.81rem','height':'3.82rem'},1000);
$("#changzhi").animate({'top':'-5%','left':'-50%'},2000);
}
function huian(){
$("#tinybox").show();
$("#huian").show();
$("#huian img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#huian img").animate({'width':'3.12rem','height':'2.55rem'},1000);
$("#huian").animate({'top':'-5%','left':'-50%'},2000);
}
function xiamen(){
$("#tinybox").show();
$("#xiamen").show();
$("#xiamen img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#xiamen img").animate({'width':'2.83rem','height':'3.12rem'},1000);
$("#xiamen").animate({'top':'-5%','left':'-50%'},2000);
}
function jinjiang(){
$("#tinybox").show();
$("#jinjiang").show();
$("#jinjiang img").show();
var w=3.5+"rem";
var h=6.29+"rem";
$("#jinjiang img").animate({'width':'1.98rem','height':'3.01rem'},1000);
$("#jinjiang").animate({'top':'-5%','left':'-50%'},2000);
}
function h(){
$("#tinybox").hide();
$("#shanxi").hide();
$("#shanxi img").animate({'width':'56','height':'110'},1);
$("#quanzhou").hide();
$("#quanzhou img").animate({'width':'56','height':'110'},1);
$("#jingzhou").hide();
$("#jingzhou img").animate({'width':'56','height':'110'},1);
$("#shanghai").hide();
$("#shanghai img").animate({'width':'56','height':'110'},1);
$("#shenyang").hide();
$("#shenyang img").animate({'width':'56','height':'110'},1);
$("#zibo").hide();
$("#zibo img").animate({'width':'56','height':'110'},1);
$("#yantai").hide();
$("#yantai img").animate({'width':'56','height':'110'},1);
$("#nanjing").hide();
$("#nanjing img").animate({'width':'56','height':'110'},1);
$("#jiangyin").hide();
$("#jiangyin img").animate({'width':'56','height':'110'},1);
$("#xiangshui").hide();
$("#xiangshui img").animate({'width':'56','height':'110'},1);
$("#changzhi").hide();
$("#changzhi img").animate({'width':'56','height':'110'},1);
$("#huian").hide();
$("#huian img").animate({'width':'56','height':'110'},1);
$("#xiamen").hide();
$("#xiamen img").animate({'width':'56','height':'110'},1);
$("#jinjiang").hide();
$("#jinjiang img").animate({'width':'56','height':'110'},1);
}
</script>
</body>
</html>