Problem in displaying Google map in jquery tab.

Problem in displaying Google map in jquery tab.

Hi,
i am using jquery mobile .
i have 4 jquery tabs. In the last tab i am displaying google map. For the first click it is showing correctly and it is taking full width whatever i mentioned,but when i click second time it is showing only a part of the map. Even i used resize() option in google map.


so anybody can help me out to get out of this problem.

  <link href="css/jquery.mobile-1.3.1.css" rel="stylesheet"  type="text/css"/>    
    <script src="js/jquery-1.10.1.js" type="text/javascript"></script>  
    <script src="js/jquery.mobile-1.3.1.js" type="text/javascript"></script>


function initialize() {
    alert('init call');
    var myLatlng = new google.maps.LatLng(13.02189, 77.60578);
    var myOptions = {
        zoom: 15,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map"), myOptions);    
    google.maps.event.trigger(map, 'resize');

}