2013-02-08 53 views
0

如何把不同的標記與不同的內容彈出fancybox? 我設法設置了fancybox,但您可以看到兩個標記的內容相同。 我想找到一種方法來爲每個製造商在我的fancybox中放入不同的內容。多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: url 
}); 

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}); 

<!-- ne pas utiliser --> 
    var url= "http://www.fancyapps.com/fancybox/"; 
    <!-- ne pas utiliser --> 

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

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

    $.fancybox({ 
    maxWidth : 800, 
    maxHeight : 600, 
    href : "rssddd/FeedEk_demo.html", 
    type : 'iframe' 

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

演示:http://ps3land.franceserv.com/

+1

我想你需要將href屬性設置爲一個變量,然後讓它根據哪個標記被點擊,以正確的值拉取該變量。不知道該怎麼做,我擔心,但也許會讓你朝正確的方向發展。 – 2013-02-08 16:40:59

回答

1

傳遞一個第四個參數來addMarkerWithWindow(),如:

addMarkerWithWindow("Lemans", new google.maps.LatLng(48.006922, 0.20874), map, 
        'http://lemans.org'); 
addMarkerWithWindow("Paris", new google.maps.LatLng(48.856291, 2.352705), map, 
        'http://parisinfo.com'); 

使參數的函數內部訪問:

function addMarkerWithWindow(name, coordinate, map,href) { 
    //your code 
} 

,並把它作爲HREF花式框選擇:

$.fancybox({ 
    maxWidth : 800, 
    maxHeight : 600, 
    href  : href, 
    type  : 'iframe' 
});

+0

它終於如此簡單 非常感謝你... – 2013-02-08 17:07:09