求一js效果

lifelongemail 2011-08-29 11:10:02

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

...全文

174 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

lifelongemail 2011-08-29

打赏
举报

为什么会木有人....

lifelongemail 2011-08-29

打赏
举报

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

fengyun817 2011-08-29

打赏
举报

[Quote=引用 4 楼 lifelongemail 的回复:]

引用 3 楼 fengyun817 的回复:

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

我就是看不懂那个..
[/Quote]
这个很简单啊。
我试着写了下：





<!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>