谷歌地图显示在 jquery 弹出窗口中

【问题标题】：Google map displaying in jquery pop up window谷歌地图显示在 jquery 弹出窗口中
【发布时间】：2012-11-15 20:59:33
【问题描述】：

我的网站使用 jQuery 1.7，我需要在灯箱中显示谷歌地图。

例如：http://dev.visualdrugs.net/mootools/gmapsoverlay/

你能帮我用 jQuery 做同样的事情吗？

谢谢

【问题讨论】：

标签： jquery jquery-ui google-maps jquery-plugins google-maps-api-3

【解决方案1】：

这里是一些关于使用 jQuery Colorbox 执行此操作的方法的说明的链接：

http://www.primecut.gr/2011/06/colorbox-with-google-maps/

这里有一些简单的代码。这需要 jQuery 和 Colorbox plugin（JavaScript 和 CSS）。

HTML

<a class="googleMapPopUp" href="https://maps.google.com.au/maps?q=south+australia" target="_blank">
    View location map
</a>

JavaScript

$('.googleMapPopUp').each(function() {
    var thisPopup = $(this);
    thisPopup.colorbox({
        iframe: true,
        innerWidth: 400,
        innerHeight: 300,
        opacity: 0.7,
        href: thisPopup.attr('href') + '&ie=UTF8&t=h&output=embed'
    });
});

Demo

【讨论】：