Community & Support

trouble with google map api centering using jstools tabs module

I am using the jstools tabs module with cck and a custom google map api. In ie7, sometimes the google map centers on the location and other times it is off centered. If it is off center then refreshing the browser fixes the problem until I load the page again. I'm sure this is a google map ie7 problem with div's and tables, but have tried every way I know to fix it and I am lost. The problem is not there in FireFox. The tabs must add a new layer to the problem that I can't figure out. Currently this is on an xampp test server running latest modules and core for drupal 5. All code below has been snipped to show the least amount of code to show problem.

Please can someone help out?

This is the sample tab code pasted in my cck contemplate.

    $form = array();

  $form['mytab'] = array(
    '#type' => 'tabset',
  );
  $form['mytab']['tab1'] = array(
    '#type' => 'tabpage',
    '#title' => t('Details'),
    '#content' => include ('test.php'),
  );
  $form['mytab']['tab2'] = array(
    '#type' => 'tabpage',
    '#title' => t('tab 2'),
    '#content' => t('contents of tab 2'),
  );
  $form['mytab']['tab3'] = array(
    '#type' => 'tabpage',
    '#title' => t('tab 3'),
    '#content' => t('contents of tab 3'),
  );

  return tabs_render($form);
?>

This is the test.php sample content

<?php
return '
<div class="InfoBox">
<div style="background-image: url('
. base_path() . path_to_theme() . '/img/bg_stateSelector.gif);background-repeat: repeat-x;font-weight:bold;font-size:110%;border:solid 1px #909090;color:#ffffff;width:;"><div style="padding-bottom:2px;padding-top:2px;padding-left:5px;">Satellite View</div></div>
<div style="padding:5px;">

    <div id="my_map" style="width: 240px; height: 175px;margin-bottom:5px;border:solid 1px #000000;"></div>
   
   
   
   
</div>

</div>'
;

?>

This sample code at the end of my custom node page. Tried it in the head using non cck lat and lon and still same problem.

<script type="text/javascript">

    //<![CDATA[



    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("my_map"));

        map.setCenter(new GLatLng(<?php print $location['latitude'] ?>,<?php print $location['longitude'] ?>), 13);
map.setMapType(G_SATELLITE_MAP);
map.addControl(new GSmallZoomControl ());
         map.checkResize();
      }

    }

    //]]>
window.onload=function(){load();}
    </script>

And this is in the head of custom page

<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAreoEldnbC0urVLXCW4-ZlBS1_0k-FMUtMN77LcH1woOstZ49RBQvrXNPCzGWFVgk_0KCcLUCHlIuQw" type="text/javascript"></script>

nobody click here