Display google map in jquery window

Question

I am using jQuery 1.7 my website, I need to show google map in lightbox.

for example: http://dev.visualdrugs.net/mootools/gmapsoverlay/

Can you help me do the same with jQuery.

thanks

Answer 1

Below is a link to some instructions on one way to do this using jQuery Colorbox:

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

Here are some simple codes. This requires jQuery and the Colorbox plugin (JavaScript and 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