Forgive my bluntness. But I can not do so that when you click on one element, the others are folded. I do not understand where to write and how to write this event.

<script type="text/javascript"> $(document).ready(function(){ $('.content dd').hide(); $('.content dt').click(function(){ $(this).next().toggle(100); return false; }); $('content dd').next().hide(); }); </script> <div class="content"> <dl> Аккордион <dt>Новость первая</dt> <dd>Текст первой новости</dd> <dt>Новость вторая</dt> <dd>Текст второй новости</dd> <dt>Новость третья</dt> <dd>Текст третьей новости</dd> </dl> </div>

    1 answer 1

    There is a ready-made jquery solution.

     <div id="accordion"> <h3><a href="#">Section 1</a></h3> <div>Section 1 content</div> <h3><a href="#">Section 2</a></h3> <div>Section 2 content</div> <h3><a href="#">Section 3</a></h3> <div>Section 3 content</div> </div> <script> $("#accordion").accordion(); </script>

    And in your example.

     $(document).ready(function(){ $('.content dd').hide(); $('.content dt').click(function(){ $('.content dt').each(function(){ $(this).next().hide(); }); $(this).next().toggle(100); return false; }); $('content dd').next().hide(); });
    • I myself want to do not much resorting to ready-made solutions - new_russian_man
    • Added as =) - alter_f4