網頁嵌套百度地圖

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="keywords" content="?懼害?闆???懼害?闆??PI锛??懼害?闆?捐??瀹?涔?宸ュ?鳳??懼害?闆?炬??瑙??蟲??寰?宸ュ?? />
<meta name="description" content="?懼害?闆??PI??瀹?涔??闆?撅?甯??╃?ㄦ?峰?ㄥ??瑙?????浣?涓??????懼害?闆?? />
<title>?懼害?闆??PI??瀹?涔??闆??lt;/title>
<!--寮??ㄧ?懼害?闆??PI-->
<style type="text/css">
    html,body{margin:0;padding:0;}
    .iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space:nowrap}
    .iw_poi_content {font:12px arial,sans-serif;overflow:visible;padding-top:4px;white-space:-moz-pre-wrap;word-wrap:break-word}
    .img1{ background:url(wxp_nav_l_1.gif);cursor:pointer;height:30px;padding-left:10px;color:#2f84c7;width:220px;filter:Alpha(opacity=70);opacity:0.8;}
    .img2{ background:url(wxp_nav_l_2.gif);cursor:pointer;height:30px;padding-left:10px;color:#808080;filter:Alpha(opacity=70);opacity:0.8;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.1&services=true"></script></head>

<body>
  <!--?懼害?闆?懼?瑰??->
 <div style="width:697px;height:550px;border:#ccc solid 1px;left:5px;top:5px" id="dituContent"></div> 
  <div style="position: absolute;left: 430px;top: 30px;" id="dituContent2">
 <table>
<th class="img1" align="left" onClick="alert('棰?瑙?????')">棰?瑙?????</th>
<tr>
<td class="img2" align="left" onClick="alert('??涓哄??甯?搴?')">??涓哄??甯?搴?</td>
</tr>
<tr>
<td class="img2" align="left" onClick="alert('??璁闆????')">??璁闆????</td>
</tr>
<tr>
<td class="img2" align="left" onClick="alert('灞??芥?ゅ?哄??')">灞??芥?ゅ?哄??</td>
</tr>
<tr>
<td class="img2" align="left" onClick="alert('??杞界?稿?蟲?版??')">??杞界?稿?蟲?版??</td>
</tr>
</table>
</div>
</body>
<script type="text/javascript">
    //??寤哄????濮????闆?懼?芥?幫?
    function initMap(){
        createMap();//??寤哄?闆??        setMapEvent();//璁劇疆?闆?句?浠?        addMapControl();//???闆?炬坊???т歡
    }
    
    //??寤哄?闆?懼?芥?幫?
    function createMap(){
        var map = new BMap.Map("dituContent");//?ㄧ?懼害?闆?懼?瑰?ㄤ腑??寤轟?涓??闆??        var point = new BMap.Point(113.263865,23.151257);//瀹?涔?涓?涓?涓?蹇??瑰????锛?杩???????濮???瑕??劇ず??缁?搴???绾?搴??????ttp://openapi.baidu.com/map/createMap.html?ョ????宸辮??劇ず???箋??
        map.centerAndZoom(point,12);//璁懼???闆?劇??涓?蹇??瑰??????骞跺??闆?炬?劇ず?ㄥ?闆?懼?瑰?ㄤ腑
        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_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});
	map.addControl(ctrl_ove);
        //???闆?句腑娣誨??姣?渚?灏烘?т歡
	var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
	map.addControl(ctrl_sca);
    }
    
    
    initMap();//??寤哄????濮????闆??</script>
</html>