Google Maps API v3 InfoWindow 中不能播放Flash的暂缓解决方法

请在< object >与< /object >之间加入<param name=”wmode” value=”transparent” />,以及< embed >加入wmode=”transparent”参数。

另:在Firefox 6或以下无论如何处理还是会出现该问题。无法解决。

内嵌在Google Maps API v3 InfoWindow中的Flash在一些浏览器中不能播放,较简单的解决方法是新建一个隐藏的position:absolute的div,和在infowindow中的空壳div(只有width和height,没有内容)保持相同的width和height,加载的时候显示隐藏的div,然后将之前的空壳div的top和left值赋予给这个div,再将Flash嵌入代码代入这个div中。

载入前清空外加隐藏:

$(‘#mainmarkerpreview’).empty().hide();

空壳div:

<div id=”markerpreview” style=”width:250px;height:150px”></div>

预备的div:

<div id=”mainmarkerpreview” style=”display:none; position:absolute; width:250px; height:150px”></div>

赋值:

$(‘#mainmarkerpreview’).html(‘<object … </object>’).css($(‘#markerpreview’).offset()).show();

如果要关闭infowindow的时候也要把这个div清空和(或)隐藏掉(注意这段要放在infowindow已产生之后):

google.maps.event.addListener($(‘#map_canvas’).gmap(‘get’, ‘iw’), ‘closeclick’, function() {
$(‘#mainmarkerpreview’).empty().hide();
});

如果拖动地图的时候,这个div也跟随移动,只需更新这个div的position:

$(document).click(function(e) {
$(‘#mainmarkerpreview’).css($(‘#markerpreview’).offset());
});

也可以用这个event(更好):

google.maps.event.addListener(map, ‘bounds_changed’, function() {
$(‘#mainmarkerpreview’).css($(‘#markerpreview’).offset());
});

依赖:jQuery 1.6、jquery-ui-map 3

Advertisements

发表评论

Fill in your details below or click an icon to log in:

WordPress.com 徽标

You are commenting using your WordPress.com account. Log Out /  更改 )

Google+ photo

You are commenting using your Google+ account. Log Out /  更改 )

Twitter picture

You are commenting using your Twitter account. Log Out /  更改 )

Facebook photo

You are commenting using your Facebook account. Log Out /  更改 )

w

Connecting to %s