帮助创造类似手风琴的风格 - jquery

Question

我目前正在实施一组类似于手风琴的风格的标签。

到目前为止，这是我的代码......

http://codepen.io/anon/pen/uqBnH

在选择其他人时，我无法关闭其他人。

我的jQuery代码......

$(function(){

 $('.panel').hide();
  $('.mobtabs').click(function(){
    $(this).next().toggle();        
  });
 });

非常感谢任何帮助。

Answer 1

您可以使用：

$(function () {
    $('.panel').hide();
    $('.mobtabs').click(function () {
        var nextPanel = $(this).next();
        $('.panel').not(nextPanel).hide();
        nextPanel.toggle();
    });
});

<强> Fiddle Demo

Answer 2

进行以下更改（我添加了滑动） -

$('.panel').hide();
$('.mobtabs').click(function(){
    $('.mobtabs').not( $(this) ).next().slideUp(); // close them all
    $(this).next().slideToggle(); // slide open (or closed if it applies) this tab       
});

Answer 3

只需关闭其他人：

$(function () {
    $('.panel').hide();
    $('.mobtabs').click(function () {
        $('.mobtabs').not($(this)).next().hide();
        $(this).next().toggle();
    });
});

<强> jsFiddle example