jQuery用户界面 - 显示/关闭标签手风琴分别

我试图建立标签，我可以在同一时间打开多个标签页的手风琴式的列表。基本上我希望它喜欢在这里工作：在底部的文档下http://jqueryui.com/demos/accordion/当你看的选项标签中，列出了禁用，活动，等你可以打开一个或所有选项卡。jQuery用户界面 - 显示/关闭标签手风琴分别

我看不出你如何设置一个手风琴做到这一点，所以我已经做了的作品拨动一个基本版本，但我必须手动输入每个选项卡，打开/关闭的ID。我敢肯定有一个更有效的方式来做到这一点，因此扩展为任意数量的项目，可能有人请告诉我这是什么......

<style> 
.newClass { display: none } 
</style> 
<script> 
$(function() { 
    $("#button-1").click(function() { 
     $("#effect-1").toggleClass("newClass", 1000); 
     return false; 
    }); 
    $("#button-2").click(function() { 
     $("#effect-2").toggleClass("newClass", 1000); 
     return false; 
    }); 
}); 
</script> 

<a href="#" id="button-1" class="ui-state-default ui-corner-all">Run Effect 1</a> 
<div id="effect-1" class=" ui-corner-all"> 
     Toggle1 
</div> 

<a href="#" id="button-2" class="ui-state-default ui-corner-all">Run Effect 2</a> 
<div id="effect-2" class=" ui-corner-all"> 
     Toggle 2 
</div>

奖励分，如果任何一个能展示如何制作动画滑动向上/向下当您单击按钮

来源

2012-04-03 Al_

你只需要设置一个泛型类的所有网页上的切换。

我用的.next（）来切换右后无论是。你可以改变这是一个类或其他任何东西。

这里有一个演示：http://jsfiddle.net/gZBDK/

这里有next（）的更多信息：http://api.jquery.com/next/

来源

2012-04-03 11:27:17

谢谢，完美的作品。不要以为你能指出正确的方向来制作它的上下滑动。 – 2012-04-03 11:34:14

雅检查了这一点：http://api.jquery.com/toggle/ – 2012-04-03 11:40:45

这里有一个更新的演示：http://jsfiddle.net/G972a/1/ – 2012-04-03 11:41:12

jQuery用户界面 - 显示/关闭标签手风琴分别

回答

相关问题