求一js效果

就是用百度地图，要求左边是地图，右边是地图的列表，当鼠标滑过右边地图列表第一个酒店的时候，地图上第一个酒店会特殊显示。当鼠标滑过左边地图的时候，右边地图列表上的也会特殊显示。
嗯，就是这个效果。求基本思路，还有实例什么的。先谢谢了~

解决方案 »

  1.   

    http://hotel.kuxun.cn/beijing-jiudian-daquan-4.html
    这种效果
      

  2.   

    这个要自己开发的百度提供了api，具体我没用过。你可以参考官方的api
    点击这里查看
      

  3.   

    这个很简单啊。
    我试着写了下：
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>在地图上打开信息窗</title>
    <style type="text/css">
     #c_1,#c_2,#c_3,#c_4,#c_5{width:200px;border:solid 1px red;margin:1px;}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>
    <script type="text/javascript">
    function show(obj){
     var  content = '<b>这是一个测试:'+obj.innerHTML+'</b>';
     map.openInfoWindow(new BMap.InfoWindow(content), new BMap.Point(116.404+obj.id.split("_")[1]*0.1, 39.915));      // 打开信息窗口
    }
    </script>
    </head>
    <body>
    <div style="width:520px;height:340px;border:1px solid gray" id="container"></div>
    <div id="c_1" onmouseover="show(this)">提示1</div>
    <div id="c_2" onmouseover="show(this)">提示2</div>
    <div id="c_3" onmouseover="show(this)">提示3</div>
    <div id="c_4" onmouseover="show(this)">提示4</div>
    <div id="c_5" onmouseover="show(this)">提示5</div>
    </body>
    </html>
    <script type="text/javascript">
    var map = new BMap.Map("container");
    var point = new BMap.Point(116.404, 39.915);
    map.centerAndZoom(point, 15);
    var opts = {
      width : 250,     // 信息窗口宽度
      height: 100,     // 信息窗口高度
      title : "Hello"  // 信息窗口标题
    }
    var infoWindow = new BMap.InfoWindow("World", opts);  // 创建信息窗口对象
    map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口
    </script>