Google Maps infoWindow未正确放置在jQuery Mobile应用程序中

Question

我在jQuery移动应用程序中嵌入了一个谷歌地图。在iPhone上查看地图并单击信息窗口时，我会出现以下行为：

1. 如果单击需要将地图向左平移的信息窗口，则信息窗口的右侧会从屏幕的右侧脱落

所有infoWindows的大小都正确，但地图根本没有平移到正确的位置。我使用以下代码放置地图：

<style type="text/css">
.page-map, .ui-content, #map_canvas { width: 100%; height: 100%; padding: 0; }
#map_canvas img{max-width:none};
.content-primary, #map_canvas { height: 100%; min-height: 100%; }
</style>

<div data-role="page" data-theme="b" id="mappage" class="page-map" style="width:100%; height:100%;">
    <div data-role="content" class="fullHeight">
        <div id="map_canvas"></div>
    </div>
</div>

我需要弄清楚，当单击使地图向左平移的标记时，如何使信息窗口正确平移。

Answer 1

自动调整窗口大小是导致此问题的原因。我调整了CSS，强制信息窗口为225像素。一旦我强制信息窗口小于iPhone视口的开口，它就会按照我的预期正确地放置信息窗口。