views:

25

answers:

2

Hi, i'm trying to have 2 tabs in the same page, but the first works great, and the second doesn't work at all.

It is possible to have 2 tabs in the same page, if yes, how can i manage that?

Both have the same code ... example : $('#tab1').tabs(); and the other $('#tab2').tabs();

Thank you

My HTML:

<section>
<div id="radioprog">
    <h2 class="fire">R&aacute;dio</h2>
    <ul id="radio-nav">
        <li><a class="dia" href="#seg">2ª</a></li>
        <li><a class="dia" href="#ter">3ª</a></li>
    </ul>

    <div id="seg" class="programacao">
        seg
    </div>


    <div id="ter" class="programacao">
        ter
    </div>

</div>      
</section>

<section id="info-tab" style="width:325px; margin-top:3px;">
<div id="tabs">
    <ul>
        <li><a href="#comentados">+ Comentados</a></li>
        <li><a href="#lidos">+ Lidos</a></li>
    </ul>

    <div id="comentados">
        <ul>
            <li><a href="#nowhere" title="Lorum ipsum dolor sit amet">Lorem</a></li>
            <li><a href="#nowhere" title="Aliquam tincidunt mauris eu risus">Aliquam</a></li>

        </ul>
    </div>

    <div id="lidos">

        <ul>
            <li><a href="#nowhere" title="Lorum ipsum dolor sit amet">Lorem</a></li>
            <li><a href="#nowhere" title="Aliquam tincidunt mauris eu risus">Aliquam</a></li>
        </ul>
    </div>
</div>      
</section>
+1  A: 

You can have several tabs (nested, on the same level, etc).

You run into issues when they share the same IDs.

See:

http://jsbin.com/eqivo/edit

Mervyn
hum... I don't understand... my code is similar, and it doesn't work.. diferent div's, diferent names, no Firebug error or warning.. but don't work.they don't have the same id : $('#radioprog').tabs(); $('#tabs').tabs();
Davidslv
A: 

I really need to rest, it is working... the problem was that the text was the same and i didn't saw that.

Sorry.

Solved

Davidslv