CGGoogleMaps in Modal PopUp

[allan1412]

Has anyone been able to display two versions of the same CGGoogleMap on the same page.
A small version with a link below to open a larger version in a Modal PopUp window.
It's the Modal PopUp version that I can't get to display correctly - it only shows a top corner of a map with rest grey. The rest of the map appears when the browser window is resized but the map marker icon isn't centered in the map.

Any ideas?

Thanks

[velden]

Sounds like a non-CGGoogleMaps issue. More likely JS.

Do you have a working link to the site?

[allan1412]

Hi - Thanks for the reply. I'm afraid the site is not yet online. I'm just using a simple modal popup script and jquery.

{literal}
<__script__ type="text/javascript">
$(document).ready(function() {
$('a.modaltrigger').click(function() {

//Getting the variable's value from a link
var modalwindow = $(this).attr('href');

//Fade in the Popup
$(modalwindow).fadeIn(300);

//Set the center alignment padding + border see css style
var popMargTop = ($(modalwindow).height() + 24) / 2;
var popMargLeft = ($(modalwindow).width() + 24) / 2;

$(modalwindow).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});

// Add the mask to body
$('body').append('<div id="mask"></div>');
$('#mask').fadeIn(300);

return false;
});

// When clicking on the button close or the mask layer the popup closed
$('a.close, #mask').live('click', function() {
$('#mask , .modalpopup').fadeOut(300 , function() {
$('#mask').remove();
});
return false;
});
});
</__script>
{/literal}