title: Calling Fancybox from Event Listener in Google Maps Instead of Default Infowindow
body: <p>I'm looking to replace the default Google Maps API InfoWindow with a Fancybox overlay.</p>
  
  <p><strong>Version</strong></p>
  
  <p>Google Maps API 3.0</p>
  
  <p><strong>Goal</strong></p>
  
  <p>Replace the default Infowindow with a Fancybox popup</p>
  
  <p><strong>Use Case</strong></p>
  
  <ol>
  <li>Google map is loaded up in full screen (100% by 100%)</li>
  <li>Markers are placed onto the map</li>
  <li>User clicks on a marker and is shown a Fancybox popup that overlays the map</li>
  <li>User clicks on "X" in the top right hand corner of the Fancybox to close it</li>
  </ol>
  
  <p>I'm at a loss as to how best to tackle this. Is it easiest to call Fancybox using the addListener event handler, passing in the marker as a parameter? If so, how would any of you recommend doing this?</p>
  
  <p>For example:</p>
  
  <pre class="lang-js prettyprint-override"><code>google.maps.event.addListener(marker, 'click', function(){
      // Call Fancybox, but how?
  });
  </code></pre>
  
  <p>Thank you in advance,</p>
  
  <p>Graham Kennedy</p>