Make Shadowbox.js work inside multiple InfoWindow - google-maps

Question

I'm trying to use Shadowbox.js inside multiple InfoWindow :
function initialize() {
//create the Map
var map = new google.maps.Map(...);
//create the Markers
var marker = new google.maps.Marker(...);
var marker2 = new google.maps.Marker(...);
//create the InfoWindow
var infoWindow = new google.maps.InfoWindow();
//link the Markers to the InfoWindow
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent('Working shadowbox link');
infoWindow.open(map, marker);
});
google.maps.event.addListener(marker2, 'click', function() {
infoWindow.setContent('Broken shadowbox link');
infoWindow.open(map, marker2);
});
//enable Shadowbox
google.maps.event.addListener(infoWindow, 'domready', function() {
Shadowbox.init({
overlayOpacity: 0.8
});
});
}
google.maps.event.addDomListener(window, 'load', initialize);
As you can see, I've successfully made it work, but only for the first InfoWindow.
This seems to be caused by my event attachment, I'm using domready :
google.maps.event.addListener(infoWindow, 'domready', function() {});
I can't find another way to "reinit" Shadowbox for each InfoWindow.
Any advice ?

Answer 1

As usual, I find the solution I'm searching for just a few minutes after writing my question...
To get Shadowbox working on every InfoWindow : you need to call Shadowbox player manually.
Use a custom class instead of rel=shadowbox :
<a href="http://placehold.it/200x200.jpg" class="dyn-shadowbox">
Shadowbox link
</a>
Every time domready is triggered on an InfoWindow, manually attach an event listener to every .dyn-shadowbox link :
google.maps.event.addListener(infoWindow, 'domready', function() {
var dynlinks = document.getElementsByClassName('dyn-shadowbox');
var n = dynlinks.length;
for (var i = 0; i < n; i++) {
var link = dynlinks[i];
link.removeEventListener('click');
link.addEventListener('click', function(ev) {
ev.preventDefault();
Shadowbox.open({
link: link,
content: link.getAttribute('href'),
player: 'img',
title: ''
});
});
}
});
Updated JSFiddle