Do accordion. But a problem arises - with the healer on the "header", it shows what is needed. But as soon as the mouse is shifted, it closes itself. How to make it appear and not come true? and hid only when you click on another element of the acorrdion

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

    2 answers 2

     $(document).ready(function(){ $('.content dd').hide(); $('.content dt').click(function(){ $(this).next().toggle(); return false; }).next().hide(); });

    Hiding, when you click on another element you will think :)

    • as far as I understood the author - he needs that when hovering an element is shown and remains visible until it clicks on another element. - LeD4eG
    • well, then I didn’t understand a bit) - Alangel

    Using the hover() method, it is necessary to prescribe two functions: one for pointing, another for moving the mouse. You, as far as I can see, have only one thing - the element is shown when pointing. therefore, the second (empty) parameter applies the inverse function — hide. you just need to add a second function that returns return: false; . The solution seems to me like this.

    Well, so that by clicking there will be something like this:

     $('content dt').click(function(){ $('content dt:visible').hide(); $('content dt').next('dd').show(); });