jqueryでタブを作成する

Question

このページでは2つのタブ（「ブラガ」と「リスボ」は2つのタブ）を作成する最良の方法を知りたいと思います。

http://www.iloja.pt/index.php?_a=viewDoc&docId=14

私はちょうど2番目のタブを選択するとき（ショー隠されたコンテンツを示す、最初のタブからコンテンツを非表示）とボタンのCSSプロパティを変更することが、私はこのことを考えていないだろうそれを実践する方法です。

正しい方向を教えてください。

ありがとうございます。

Answer 1

http://jqueryui.com/demos/tabs/を意味しますか？

これは上記のとおりです。多くのオプションがあります。ドキュメントも参照してください。

Answer 2

例として、このようにすることができます。

<script> 
    $(function() { 
     $("#tabs").tabs(); 
    }); 
    </script> 



<div class="demo"> 

<div id="tabs"> 
    <ul> 
     <li><a href="#tabs-1">braga</a></li> 
     <li><a href="#tabs-2">lisboa</a></li> 

    </ul> 
    <div id="tabs-1"> 
     <p>braga</p> 
    </div> 
    <div id="tabs-2"> 
     <p>lisboa</p> 
    </div> 

</div> 

</div><!-- End demo --> 



<div style="display: none;" class="demo-description"> 
<p>Click tabs to swap between content that is broken into logical sections.</p> 
</div><!-- End demo-description --> 

Answer 3

タブ

<div id="tabs" style="height: auto;"> 
    <ul> 
      <li><a href="#subtabs-1" onclick="GetTab1();return false;">Tab1</a></li> 
      <li><a href="#subtabs-2" onclick="GetTab2();return false;">Tab2</a></li> 

     </ul> 
<div id="subtabs-1" style="height: auto; overflow: hidden;"> 
</div> 
<div id="subtabs-2" style="height: auto; overflow: hidden;"> 
</div> 

$(document).ready(function() { 
         $("#tabs").tabs(); 
      $("#tabs").tabs({ selected: '<%=Model.SelectedTab %>' }); 
    }); 

Note: onclick fill the html in the tabs