谷歌地图信息窗口未正确显示

Question

我有一个标准的Google地图信息窗口，当单击标准的Google标记时会打开。指向标记的箭头似乎偏了几个像素。我一直在努力找出我的CSS中有哪些属性影响它，但一直没有结果。影响img { max-width: 100% }的ZURB Foundation框架属性导致了一些其他问题，但我能够找到并进行调整。但是我似乎找不到这个问题的原因。我正在使用ZURB v4和GMapsv3。

http://stage2.curran-connors.com/reliance/index.php/contact/

单击标记，您将看到箭头从信息窗口的边框下方开始。

- Nick Poulos

Answer 1

Zurb Foundation将box-sizing样式设置为border-box。这会导致您在Google Maps信息窗口中看到的对齐错误。

解决方法：

#map_container div {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

- Pete Parker

---

谢谢Pete，感谢你的帮助。实际上我也认为那是个问题，但是在Firebug中全局关闭它似乎没有给我想要的结果。我应该再试一下。你的解决方案非常好。再次感谢。 - Nick Poulos

Answer 2

我曾经遇到过同样的问题，控件没有显示出来，Infowindow也没有正常显示。JavaScript显示了以下错误：

Uncaught Type Error: undefined is not a function.

从prototype.js中注释/删除以下代码后，我的问题得到了解决。

this.each(function(value, index) {

      results.push(iterator.call(context, value, index));
});

- zeeshan

---

Zeeshan，看起来我们遇到的问题不一样。我的JavaScript运行得很好，没有错误。我在将Google地图InfoWindow样式化为正确位置时遇到了问题，以覆盖Google地图标记。Pete Parker的CSS修复通过调整box-sizing属性将InfoWindow移动到正确位置，如他的答案所解释的那样。 - Nick Poulos