227 lines
8.7 KiB
HTML
227 lines
8.7 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
|
|||
|
|
<title>深圳驭鑫科技有限公司</title>
|
|||
|
|
<link rel="stylesheet" href="css/css.css">
|
|||
|
|
<link rel="stylesheet" href="css/css5.css">
|
|||
|
|
<link rel="shortcut icon" href="images/logo.jpg">
|
|||
|
|
<style>
|
|||
|
|
.page1{
|
|||
|
|
background: url(img/bg7.jpg);
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.1&services=true"></script>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div class="mainpage">
|
|||
|
|
<div class="main"> <!-- 主页 -->
|
|||
|
|
<div class="navigation">
|
|||
|
|
<div class="logo"><img src="images/logo.jpg" alt="深圳驭鑫科技有限公司" title="深圳驭鑫科技有限公司" style="width: 45px;height: 45px;"></div>
|
|||
|
|
<div class="li-totle" id="li0">
|
|||
|
|
<a href="index.html"><div class="li-1" id="li1"> <p> 首页 </p></div></a>
|
|||
|
|
<a href="gywm.html"><div class="li-2" id="li2"> <p> 关于我们 </p></div></a>
|
|||
|
|
<a href="cpjs.html"><div class="li-3" id="li3"> <p> 产品介绍 </p></div></a>
|
|||
|
|
<a href="jjfa.html"><div class="li-4" id="li4"> <p> 解决方案 </p></div></a>
|
|||
|
|
<a href="javascript:void(0);"><div class="li-5" id="li5"> <p> 联系我们 </p></div></a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="page1">
|
|||
|
|
<a href="index.html"><div class="idc">联系我们</div></a>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="space5">
|
|||
|
|
<div class="text-area">
|
|||
|
|
<div class="area-1">我们期待您的联系</div>
|
|||
|
|
<div class="bg2"></div>
|
|||
|
|
<div class="area-2">
|
|||
|
|
<p>为公司的成长和发展</p>
|
|||
|
|
<p>及时选择合适的人员并将他们安置在正确的位置</p>
|
|||
|
|
<p>以便每个成员</p>
|
|||
|
|
<p>都能大限度地发挥各自的能力</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="introduce">
|
|||
|
|
<div class="e-mail"><a href="zmz@yxsilicon.com"><img src="img/e-mail.jpg" alt=""></a></div>
|
|||
|
|
<div class="posit"><a href=""><img src="img/position.jpg" alt="点我发送邮件"></a></div>
|
|||
|
|
<div class="e-mail-1"><a href="zmz@yxsilicon.com">zmz@yxsilicon.com</a></div>
|
|||
|
|
<div class="posit-1"><a href=""><img src="img/position-1.jpg" alt="公司地址"></a> </div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="page5">
|
|||
|
|
<div class="article">
|
|||
|
|
<div class="area-3">公司地址</div>
|
|||
|
|
<div class="bg3"></div>
|
|||
|
|
<div style="width:697px;height:550px;border:#ccc solid 1px;" id="dituContent"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="space2"></div>
|
|||
|
|
|
|||
|
|
<div class="page3">
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="space3"> </div> <!-- 留白区 -->
|
|||
|
|
|
|||
|
|
<div class="pageend"> <!-- 页尾 -->
|
|||
|
|
<div class="contact1">
|
|||
|
|
<div class="c0"> <p>工作时间：9:00 - 18:00</p> </div>
|
|||
|
|
</div>
|
|||
|
|
<div class="contact2">
|
|||
|
|
<div class="c1"> <a href="">广东省深圳市南山区高新中三道2号软件园一期一栋302-1室</a> </div>
|
|||
|
|
|
|||
|
|
<div class="c2"> <a href="zmz@yxsilicon.com">zmz@yxsilicon.com </a> </div>
|
|||
|
|
</div>
|
|||
|
|
<div class="contact3">
|
|||
|
|
<a href=""><img src="images/logo.jpg" alt="深圳驭鑫科技有限公司" title="深圳驭鑫科技有限公司" class="logo-1"></a>
|
|||
|
|
</div>
|
|||
|
|
<div class="copy">Copyright ©深圳驭鑫科技有限公司 <a href="https://beian.miit.gov.cn/#/Integrated/index">粤ICP备2021012067号-2</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
var li1 = document.getElementById('li1')
|
|||
|
|
var li2 = document.getElementById('li2')
|
|||
|
|
var li3 = document.getElementById('li3')
|
|||
|
|
var li4 = document.getElementById('li4')
|
|||
|
|
var li5 = document.getElementById('li5')
|
|||
|
|
|
|||
|
|
li1.onmouseover = function(){
|
|||
|
|
li1.style.backgroundColor = 'white'
|
|||
|
|
}
|
|||
|
|
li1.onmouseout = function(){
|
|||
|
|
li1.style.backgroundColor = ''
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
li2.onmouseover = function(){
|
|||
|
|
li2.style.backgroundColor = 'white'
|
|||
|
|
}
|
|||
|
|
li2.onmouseout = function(){
|
|||
|
|
li2.style.backgroundColor = ''
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
li3.onmouseover = function(){
|
|||
|
|
li3.style.backgroundColor = 'white'
|
|||
|
|
}
|
|||
|
|
li3.onmouseout = function(){
|
|||
|
|
li3.style.backgroundColor = ''
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
li4.onmouseover = function(){
|
|||
|
|
li4.style.backgroundColor = 'white'
|
|||
|
|
}
|
|||
|
|
li4.onmouseout = function(){
|
|||
|
|
li4.style.backgroundColor = ''
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
li5.onmouseover = function(){
|
|||
|
|
li5.style.backgroundColor = 'white'
|
|||
|
|
}
|
|||
|
|
li5.onmouseout = function(){
|
|||
|
|
li5.style.backgroundColor = ''
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
//创建和初始化地图函数：
|
|||
|
|
function initMap(){
|
|||
|
|
createMap();//创建地图
|
|||
|
|
setMapEvent();//设置地图事件
|
|||
|
|
addMapControl();//向地图添加控件
|
|||
|
|
addMarker();//向地图中添加marker
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//创建地图函数：
|
|||
|
|
function createMap(){
|
|||
|
|
var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
|
|||
|
|
var point = new BMap.Point(113.946629,22.550779);//定义一个中心点坐标
|
|||
|
|
map.centerAndZoom(point,18);//设定地图的中心点和坐标并将地图显示在地图容器中
|
|||
|
|
window.map = map;//将map变量存储在全局
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//地图事件设置函数：
|
|||
|
|
function setMapEvent(){
|
|||
|
|
map.enableDragging();//启用地图拖拽事件，默认启用(可不写)
|
|||
|
|
map.enableScrollWheelZoom();//启用地图滚轮放大缩小
|
|||
|
|
map.enableDoubleClickZoom();//启用鼠标双击放大，默认启用(可不写)
|
|||
|
|
map.enableKeyboard();//启用键盘上下左右键移动地图
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//地图控件添加函数：
|
|||
|
|
function addMapControl(){
|
|||
|
|
//向地图中添加缩放控件
|
|||
|
|
var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
|
|||
|
|
map.addControl(ctrl_nav);
|
|||
|
|
//向地图中添加比例尺控件
|
|||
|
|
var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
|
|||
|
|
map.addControl(ctrl_sca);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//标注点数组
|
|||
|
|
var markerArr = [{title:"公司地址",content:"深圳市南山区软件园一期1栋302-1室",point:"113.946166|22.550379",isOpen:0,icon:{w:21,h:21,l:0,t:0,x:6,lb:5}}
|
|||
|
|
];
|
|||
|
|
//创建marker
|
|||
|
|
function addMarker(){
|
|||
|
|
for(var i=0;i<markerArr.length;i++){
|
|||
|
|
var json = markerArr[i];
|
|||
|
|
var p0 = json.point.split("|")[0];
|
|||
|
|
var p1 = json.point.split("|")[1];
|
|||
|
|
var point = new BMap.Point(p0,p1);
|
|||
|
|
var iconImg = createIcon(json.icon);
|
|||
|
|
var marker = new BMap.Marker(point,{icon:iconImg});
|
|||
|
|
var iw = createInfoWindow(i);
|
|||
|
|
var label = new BMap.Label(json.title,{"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20)});
|
|||
|
|
marker.setLabel(label);
|
|||
|
|
map.addOverlay(marker);
|
|||
|
|
label.setStyle({
|
|||
|
|
borderColor:"#808080",
|
|||
|
|
color:"#333",
|
|||
|
|
cursor:"pointer"
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
(function(){
|
|||
|
|
var index = i;
|
|||
|
|
var _iw = createInfoWindow(i);
|
|||
|
|
var _marker = marker;
|
|||
|
|
_marker.addEventListener("click",function(){
|
|||
|
|
this.openInfoWindow(_iw);
|
|||
|
|
});
|
|||
|
|
_iw.addEventListener("open",function(){
|
|||
|
|
_marker.getLabel().hide();
|
|||
|
|
})
|
|||
|
|
_iw.addEventListener("close",function(){
|
|||
|
|
_marker.getLabel().show();
|
|||
|
|
})
|
|||
|
|
label.addEventListener("click",function(){
|
|||
|
|
_marker.openInfoWindow(_iw);
|
|||
|
|
})
|
|||
|
|
if(!!json.isOpen){
|
|||
|
|
label.hide();
|
|||
|
|
_marker.openInfoWindow(_iw);
|
|||
|
|
}
|
|||
|
|
})()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
//创建InfoWindow
|
|||
|
|
function createInfoWindow(i){
|
|||
|
|
var json = markerArr[i];
|
|||
|
|
var iw = new BMap.InfoWindow("<b class='iw_poi_title' title='" + json.title + "'>" + json.title + "</b><div class='iw_poi_content'>"+json.content+"</div>");
|
|||
|
|
return iw;
|
|||
|
|
}
|
|||
|
|
//创建一个Icon
|
|||
|
|
function createIcon(json){
|
|||
|
|
var icon = new BMap.Icon("http://app.baidu.com/map/images/us_mk_icon.png", new BMap.Size(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h)})
|
|||
|
|
return icon;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
initMap();//创建和初始化地图
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|