Question

我想知道在点击Google地图中的标记时如何打开fancybox弹出窗口。我知道这个问题已被提出，但答案是错误的或没有答案。很多人都想知道这样做的技术，尽管我认为很少有人能得到答案...... 如果你有一个明确而准确的答案，那么你将会非常高兴。这是我的一次尝试，但这不起作用。

<script type='text/javascript'>//<![CDATA[ 
$(function(){
function initialize() {

    var mapOptions = {
      zoom: 4,
       disableDefaultUI: true,
      center: new google.maps.LatLng(45.35, 4.98),
      mapTypeId: google.maps.MapTypeId.TERRAIN
    }
    var map = new google.maps.Map(document.getElementById('map_canvas'),
                                  mapOptions);

    addMarkerWithWindow("Lemans", new google.maps.LatLng(48.006922, 0.20874), map);
    addMarkerWithWindow("Paris", new google.maps.LatLng(48.856291, 2.352705), map);
}


function addMarkerWithWindow(name, coordinate, map) {
 $.fancybox({
     content: contentForBox
});

var image = 'rss.png';
var marker = new google.maps.Marker({
  map: map,
  icon: image,
  position: coordinate
});


    var styles = [
   {
      featureType: "all",
      stylers: [
        { saturation: -15 },
        { lightness: -10 },
      ]
    },

            ];
map.setOptions({styles: styles});



  var contentForBox = '<a class="fancybox" rel="group"   href="http://www.ministryofsound.com/Uploads/radio/Chilled_96_artistImage_jpg_l.jpg"><img     src="small_image_2.jpg" alt="qs" /></a>';


       var div = document.createElement('DIV');
    div.innerHTML = 'hello';

google.maps.event.addListener(marker, 'click', function() {

    $.fancybox({
        href: contentForBox


        // other options
    });


});
}
initialize();
});//]]>  
google.maps.event.addDomListener(window, 'load', initialisation);
</script>

Answer 1

href-option需要一个URL，而不是一个HTML片段：

google.maps.event.addListener(marker, 'click', function() {
 $.fancybox({
  href: 
    'http://www.ministryofsound.com/Uploads/radio/Chilled_96_artistImage_jpg_l.jpg'
 });
});

Fancybox infowindow谷歌地图

1 个答案: