Google Maps in Popup not showing until resize

Hello,

I try to embed a Google Map (Plugin “Maps Builder”) into a popup on my website. When the popup opens the map window is showing, but it is completely blank. Only when I manually resize the browser window will it show the map correctly.

Here you can see what the map looks like when the popup is being opened: Click

Of course I already did a little bit of googling and found the two following sites:
Sliders inside popups in the popup maker documentation and this question at stackoverflow, learning, that popups are initialized on pageload with a size of 0x0 and thus the map not showing properly when the popup finally emerges.

Here is what I tried according to the two pages that I mentioned:

1. Add the following code to the functions.php (btw. I’m using theme “Illdy”)

add_action( 'wp_footer', 'my_custom_popup_scripts', 500 );
function my_custom_popup_scripts() { ?>
<script type="text/javascript">
		(function ($, document, undefined) {
    
				jQuery('.pum').on('pumAfterOpen', function () {
   					jQuery(window).trigger('resize');
				});
    
		}(jQuery, document))  
</script><?php
}

2. Installed the Simple Custom CSS/JS plugin, added a new js script with the following content (settings: internal, footer, in frontend)

jQuery('.pum').on('pumAfterOpen', function () {
      // If you know the map resize function call it here. Otherwise:
      $(window).trigger('resize');
  });

and (second try)

jQuery(document).ready(function( $ ){
  jQuery('.pum').on('pumAfterOpen', function () {
      // If you know the map resize function call it here. Otherwise:
      $(window).trigger('resize');
  });
});

(in the plugin documentation it tells to wrap the code in the jQuery.ready code part)

None of which worked. Can anybody help me find a solution to this? Any help would be much appreciated.

Best regards, David

• This topic was modified 7 years, 6 months ago by cubic00.
• This topic was modified 7 years, 6 months ago by cubic00.
• This topic was modified 7 years, 6 months ago by cubic00.