JQuery 写bootstrap手风琴效果

来源：互联网发布：深圳软件开发待遇编辑：程序博客网时间：2024/06/10 09:06
    <div class="panel panel-info">        <div class="panel-heading">            <h3 class="panel-title"><a href="javascript:;">日期</a></h3>        </div>        <div class="panel-body">            Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.        </div>    </div>    <div class="panel panel-primary">        <div class="panel-heading">            <h3 class="panel-title"><a href="javascript:;">价格</a></h3>        </div>        <div class="panel-body">            Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.        </div>    </div>    <div class="panel panel-success">        <div class="panel-heading">            <h3 class="panel-title"><a href="javascript:;">距离</a></h3>        </div>        <div class="panel-body">            Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.        </div>    </div>    <script type="text/javascript">        $('.panel-body').hide();        $('.panel-title').click(function(){            $(this).parent().next().slideToggle();            $('.panel-body').not($(this).parent().next()).slideUp();        });    </script>
0 0