Google地图和jQuery标签

我在简单的jQuery选项卡中包含的Google地图存在轻微问题.

下面我贴了代码:

jQuery的:

$(document).ready(function() {

    //Default Action
    $(".tab_content").hide();
    $("ul.tabs li:first").addClass("active").show(); 
    $(".tab_content:first").show(); 

    //On Click Event
    $("ul.tabs li").click(function() {
        $("ul.tabs li").removeClass("active");
        $(this).addClass("active"); 
        $(".tab_content").hide(); 
        var activeTab = $(this).find("a").attr("href"); 
        $(activeTab).fadeIn();
        return false;
    });

});

以下是标签的HTML:

    

        
Tab1
        
Tab2
        
Tab3
        
Tab4
    
    

        

            
Tab1
        
        

            
Tab2
        
        

            

                google Map
            
        
        

            
Tab4
        
    

我真的不知道该怎么做.这是谷歌地图的一般问题,还是我的标签有什么问题？但是他们对其他一切都很好.

提前谢谢你的帮助

我已经解决了这个问题.

将jQuery中的hide()更改为css.visibility,因此选项卡看起来像这样.

$(document).ready(function() {

    //Default Action
    $(".tab_content").css({'visibility':'hidden'  , 'position':'absolute'});
    $("ul.tabs li:first").addClass("active").show(); 
    $(".tab_content:first").css({'visibility':'visible' , 'position':'static'}); 

    //On Click Event
    $("ul.tabs li").click(function() {
        $("ul.tabs li").removeClass("active");
        $(this).addClass("active"); 
        $(".tab_content").css({'visibility':'hidden' , 'position':'absolute'}); 
        var activeTab = $(this).find("a").attr("href"); 
        $(activeTab).css({'visibility':'visible'  , 'position':'static'});
        return false;
    });

});

一切正常.

Bootstrap3:https://github.com/twbs/bootstrap/issues/2330

$('a[href="#edit_tab_map"]').on('shown.bs.tab', function(e)
    {
        google.maps.event.trigger(map, 'resize');
    });