【jQuery】Tabの中にGoogleMapを埋め込むとなぜかずれるときの対処法

JQueryのタブのなかにGoogleMapを埋め込んだときに、JQuery側の弊害ではまったので、メモ。
JQueryのタブの中に、GoogleMapの埋め込みコードを入れると、
中心座標の緯度・経度を指定しているにもかかわらず、ずれる。

調べてみると、似たような現象に対する解決策を発見！
jQuery UI TabsでGoogleMapを利用する。

対処法としては、タブの非表示方法を別のやり方で見えなくしてあげればいいとのこと。

以下実際に対処した部分です。

もともとのソース

$(function(){

//いったんタブ全体を非表示にする
$('.detail_tab .tab_conts').hide();

//デフォルトでtab_conts.box_01を表示する
$('.detail_tab .tab_conts.box_01').show();

$('.detail_tab .d_tab li').click(function() {
     $('.detail_tab .d_tab li').removeClass("hit");
     $(this).addClass("hit");
     var index = $('.detail_tab .d_tab li').index(this);
     $('.detail_tab .tab_conts').hide();
     $('.detail_tab .tab_conts').eq(index).show();
});

});

どうやらメソッド「.hide()」でタブを非表示するときにCSSの「display:none」が呼ばれているみたいなので、
.hide()を使わずに無理くりCSSで見えなくさせました。

カスタマイズしたソース

$(function(){

//いったん全部のタブの中身を非表示にする
$('.detail_tab .tab_conts').css( {'position':'absolute','left':'-10000px'});

//最初に表示する一番目のタブの中身だけCSSを変更して表示
$('.detail_tab .tab_conts.box_01')( {'left': '0','position':'relative','display':'block'});

$('.detail_tab .d_tab li').click(function() {
     $('.detail_tab .d_tab li').removeClass("hit");
     $(this).addClass("hit");
     var index = $('.detail_tab .d_tab li').index(this);

     //いったん全部のタブの中身を非表示にする
     $('.detail_tab .tab_conts').css( {'position': 'absolute','left':'-10000px'});

     //選択されたタブ番号の中身をCSSを変更して表示
     $('.detail_tab .tab_conts.box_01')( {'left': '0','position':'relative', 'display':'block'});
});

});

一応、これで解決です。
ただ、あまりスマートな感じがしない。。。