JQuery垂直选项卡 - 创建额外链接到选项卡

我正在使用此脚本的jQuery垂直选项卡。JQuery垂直选项卡 - 创建额外链接到选项卡

http://www.scriptbreaker.com/javascript/script/JQuery-vertical-tab-menu

<script language="JavaScript"> 
$(document).ready(function() { 

$(".tabs .tab[id^=tab_menu]").hover(function() { 
    var curMenu=$(this); 
    $(".tabs .tab[id^=tab_menu]").removeClass("selected"); 
    curMenu.addClass("selected"); 

    var index=curMenu.attr("id").split("tab_menu_")[1]; 
    $(".curvedContainer .tabcontent").css("display","none"); 
    $(".curvedContainer #tab_content_"+index).css("display","block"); 
}); 
}); 
</script>

下面是标签（链接）的HTML

<div class="tabscontainer"> 
<div class="tabs"> 
    <div class="tab selected first" id="tab_menu_1"> 
     <div class="link">JavaScript</div> 
     <div class="arrow"></div> 
    </div> 
    <div class="tab" id="tab_menu_2"> 
     <div class="link">CSS</div> 
     <div class="arrow"></div> 
    </div> 
     <div class="tab last" id="tab_menu_3"> 
     <div class="link">JQuery</div> 
     <div class="arrow"></div> 
    </div> 
</div>

我试图从一个标签的内容到另一个选项卡中创建一个额外的链接。

所以这样我可以链接到下一个选项卡或最后一个选项卡，保持相同的功能在当前选项卡的链接（无刷新）

这是我在计算器的第一个问题，我已经搜查远宽。

我真的很感谢所有的帮助。这是一个伟大的社区。

UPDATE：

好吧，这里是我完整的代码编辑：

<script type="text/javascript"> 
$(document).ready(function() { 

$(".tabs .tab[id^=tab_menu]").click(function() { 
    var curMenu=$(this); 
    $(".tabs .tab[id^=tab_menu]").removeClass("selected"); 
    curMenu.addClass("selected"); 

    var index=curMenu.attr("id").split("tab_menu_")[1]; 
    $(".curvedContainer .tabcontent").css("display","none"); 
    $(".curvedContainer #tab_content_"+index).css("display","block"); 

}); 

}); 
</script> 

<div class="curvedContainer">  

<div class="tabcontent" id="tab_content_1" style="display:block"> 
<p>text</p> 
</div> 

<div class="tabcontent" id="tab_content_2"> 
<p>text</p> 
</div> 

<div class="tabcontent" id="tab_content_3"> 
<p>text</p> 
</div> 

<div class="tabcontent" id="tab_content_4"><h2 class="wwd_title"> 
<p>text</p> 
</div> 

</div> 

<div class="tabscontainer"> 

<div class="tabs">   
<div class="tab selected first" id="tab_menu_1">    
<div class="link">Onefish</div>  
</div>   
<div class="tab" id="tab_menu_2">    
<div class="link">Twofish</div>     
</div>   
<div class="tab" id="tab_menu_3">    
<div class="link">Redfish</div>   
</div>   
<div class="tab last" id="tab_menu_4">    
<div class="link">Bluefish</div>      
</div>  
</div>

来源

2012-05-20 Lawrence Black

请发布您迄今尝试过的代码，以实现您想要实现的目标。（您发布的代码是垂直选项卡菜单代码。） – neo108

作为旁注，正确的脚本标签应该看起来像'

它的工作原理根据您的要求

在任何标签

围棋只需添加

 <div class="tabs"> 
      <div class="tab selected first" id="tab_menu_1"> 
       <div class="link">JavaScript</div> 
       <div class="arrow"></div> 
      </div> 
     </div>

这个链接http://jsfiddle.net/ipsjolly/ssR5f/

有在3rd类似的标签通过它我们可以跳转到1st选项卡。

来源

2012-05-21 07:08:32

我得到了使用现有类将标签粘贴到另一个标签中的概念，但这不是我期待的。谢谢。 –

JQuery垂直选项卡 - 创建额外链接到选项卡

相关问题