I need to put a link on a Google map marker. It works with an external URL (http://...) but it doesn't with a div link. When we click on a marker, I want that it opens a div with a modal effects.
Here is the HTML with the div to open :
<div class="modal faune">
<div class="barre_gallery">
<img alt="" class="close" onclick="$.fn.custombox('close');" src="img_content/croix.png" width="30"/>
<h1>Test</h1>
</div>
<p>Paragraphe test</p>
</div>
Here is the JS :
var gmarkers1 = [];
var markers1 = [];
var infowindow = new google.maps.InfoWindow({
content: ''
});
markers1 = [
['4', "Les ânes de Pontisse", 50.692001, 5.639683, 'faune', 'content/pictos/picto_faune.png', '$(".modal.faune")'],
]
function addMarker(marker) {
var category = marker[4];
var title = marker[1];
var pos = new google.maps.LatLng(marker[2], marker[3]);
var content = marker[1];
var icon = marker[5];
var url = marker[6]
marker1 = new google.maps.Marker({
title: title,
position: pos,
category: category,
map: map,
icon : icon,
url: url,
});
gmarkers1.push(marker1);
// Marker click listener
google.maps.event.addListener(marker1, 'click', function() {
window.location.href = this.url;
this.addClass("list-group-item blur");
});
}
Do you have any ideas ? Thanks !
window.location.href = $(".modal.faune")
isn't going to work. You need to have some logic to work out if it's an external href or a div link (e.g. a boolean attribute on each marker).