Google Maps znotraj jQuery accordiona

Problem: Google Maps se ne naloži pravilno znotraj jQuery accordiona.
Stric Google pravi, da je problem zaradi display: none v CSS.
Problem izgine, če je tab v accordionu, kjer se nahaja zemljevid pri nalaganju strani odprt.

Koda:

<ul id="accordion">
  <li class="acc-1">
    <div class="inner"><h3>Kje se nahajamo</h3>
    </div>
    <ul style="display: none; ">
      <li><!-- content goes here --></li>
</ul>
</li>
<li class="acc-2">
  <div class="inner"><h3>Title2</h3>
  </div>
  <ul>
    <li><!-- content goes here --></li>
</ul>
</li>
<li class="acc-3">
  <div class="inner"><h3>Title3</h3>
  </div>
  <ul>
    <li><!-- content goes here --></li>
</ul>
</li>
</ul>

<script type="text/javascript">
    $("#accordion > li > div.inner").click(function(){
        if(false == $(this).next().is(':visible')) {
            $('#accordion ul').slideUp(300);
        }
        $(this).next().slideToggle(300);
    });
    $('#accordion ul:eq(0)').show();//odpri prvi tab - v tem primeru zadeva deluje
</script>

Poskusil sem dopolniti jQuery kodo s primeri z weba (bind, resize, destroy eventi), vendar mi ne uspe.

Pomoč in nasveti dobrodošli!

2 odgovora

Sam tolk, da sporočim da sem obupal in prešaltal na jQuery UI Tabs.