Google Map in jQuery UI tabs (newbie)

Google Map in jQuery UI tabs (newbie)

Hi all,

I am using some CSS (suggested at the bottom of this page) to make my Google map responsive. When I put the map in jQuery UI tabs the map loads fine in the first tab but in the second tab it loads off centre as you can see here.

There is some related discussion here and also the following suggestion here (re resizing): 


Code: 
$('#example').bind('tabsshow', function(event, ui) { if (ui.panel.id == "map-tab") { resizeMap(); } });

So far I have tried a few things that have not worked but maybe my syntax is wrong. Can anyone please suggest a jQuery snippet that would resize / recenter / reload the map when the second tab is clicked? Or any other comments / suggestions re this problem?

Thank you...