Reload Google Map in a tab to make map appear

  • Resolved meeee2

    (@majdaly)


    8 years, 7 months ago

    When a Google map is included in a tab, it needs to be reloaded before it will appear (something to do with it being hidden initially and the map is still hidden even though the tab is shown).

    I have it working by adding the reload code directly into the tabby.js file at the end of the click function, however I’d rather not change the source. Is there a way to do this without changing the source? I’ve tried the following but the click event is not getting triggered here:

    $(document).ready(function(){
    $( "li#tablist1-tab2" ).click(function() {
        alert ("hello");
    });
});

    Great plugin, by the way!

    https://wordpress.org/plugins/tabby-responsive-tabs/

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author cubecolour

    (@numeeja)

    8 years, 7 months ago

    This is due to the maps loading with zero dimensions when not initially visible on page load. Plugins to insert galleries generated with javascript have the same issue.

    I have found on my test sites that Maps inserted into tab content using Pippin Williamson’s Simple Google Maps Short Code plugin do not have this problem and seem to load correctly.

    Thread Starter meeee2

    (@majdaly)

    8 years, 7 months ago

    Thanks for the quick response.
    That looks like a good plugin, but unfortunately is isn’t suitable for me – I’m displaying map with multiple custom markers.

    Any idea why I can’t capture the click event outside the plugin? (I can capture click events on other elements on the page, but not the tabs)

    Plugin Author cubecolour

    (@numeeja)

    8 years, 7 months ago

    I’m not sure why the click event cannot be captured using the code you give above.

    It may be worth investigating how Pippin manages to get maps displayed in tabs in his plugin and see whether the same approach can be applied to the plugin map plugin you are using.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Reload Google Map in a tab to make map appear’ is closed to new replies.