在asp.net中的css垂直製表符

Question

我想要一個使用css的垂直選項卡菜單，它將顯示爲像ajax控件工具包選項卡容器。請參閱second example in the link。 我需要用css來實現這一點，而不必使用ajax控件工具包。

Answer 1

你可以看一下它產生的CSS，使一個jQuery腳本來控制狀態，就像這樣：

$(document).ready(function() {  
    var tabs = $('div.tabs > div'); 
    tabs.hide().filter(':first').show(); 

    $('ul.tab_nav li a').click(function() { 
     tabs.hide(); 
     tabs.filter(this.hash).show(); 
     $('ul.tab_nav li a').parent().removeClass('selected'); 
     $(this).parent().addClass('selected'); 
     return false; 
    }).filter(':first').click(); 
} 

對於某些HTML這樣的：

<ul class="tab_nav"> 
    <li><a href="#tab-1">Tab 1</a></li> 
    <li><a href="#tab-2">Tab 2</a></li> 
</ul> 
<div class="tabs"> 
    <div id="tab-1"> 
     Tab 1 
    </div> 
    <div id="tab-2"> 
     Tab 2 
    </div> 
</div>