Question

这是我的zurb基础代码，带有标签：

http : // codepen.io/vomaringo/pen/RPRdRr

我想通过再次单击选项卡来关闭面板选项卡。可以在zurb基础上用一个选项来完成，还是可以用jquery帮助我？感谢您阅读我的帖子。
问候
千斤顶

Answer 1

查看此处的代码

<强> HTML

<ul class="accordion" data-accordion>
  <li class="accordion-navigation">      
     <a href="#panel1a">Accordion 1</a>
     <a href="#panel2a">Accordion 2</a>
    <div id="panel1a" class="content active">
      Panel 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
    </div>
      <div id="panel2a" class="content">
      Panel 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
    </div>
  </li>
</ul>

<强> CSS

.accordion-navigation > a{width:200px;float:left;}
.content{display:block;float:none;width:100%;clear:both}

<强>的jQuery

   $(document).foundation();
$( ".tabs" ).click(function() {
  if ( $( '.content' ).hasClass('active')) {
    $('content').hide();
  }    
});

http://jsfiddle.net/vasanthanvas/axvbLuja/

如何关闭基础zurb选项卡中的打开内容面板

1 个答案: