Показать сообщение отдельно
  #1 (permalink)  
Старый 09.07.2014, 19:13
Новичок на форуме
Отправить личное сообщение для Александр О. Посмотреть профиль Найти все сообщения от Александр О.
 
Регистрация: 09.07.2014
Сообщений: 3

Меню аккордеон на задержке при событии hover | jQuery
Доброго всем дня!

У меня проблема. Некорректно работает скрипт для меню-аккордеона.

Я составил довольно обычный jquery-скрипт для того, чтобы в меню-аккордеон при наведении мышки
на пункты разделов меню после небольшого таймаута в 0.5 секунды плавно раскрывались соответствующие вложенные пункты и подразделы.

Вот этот скрипт:

<script type="text/javascript">
$(document).ready(function(){
    
    $("#menu1 a.ssylka_razd").hover(function(){
 
        $(this).addClass('waiting');
        setTimeout(function(){
            p = $('#menu1 .waiting').parent().next().children('ul');
            p.slideDown(500).removeClass('waiting');
        },800);
 
    }, function(){
        $('#menu1 .waiting').removeClass('waiting');
    });
});
</script>


Вот оптимизированный (сокращенный) HTML-код, который обслуживает скрипт:

<ul id='menu1'>
      <li class='current1'>
          <a href='#' class='ssylka'>МАНГАЛЫ</a>
      </li>
      <li>
          <a href='#' class='ssylka_razd'>КОПТИЛЬНИ</a>
      </li>
      <li>
            <ul> 
                 <li> 
                       <a href='#' class='ssylka'>Коптильни с гидрозатвором на подставке</a> 
                 </li> 
                 <li> 
                       <a href='#' class='ssylka'>Коптильни малые</a>
                 </li>
             </ul>
      </li>
      <li>
          <a href='#' class='ssylka_razd'>МЕБЕЛЬ ДЛЯ ДАЧИ Camping World</a>
      </li>
      <li>
            <ul> 
                  <li>
                        <a href='#' class='ssylka'>Складные стулья</a>
                  </li>
                  <li> 
                         <a href='#' class='ssylka'>Складные кресла</a> 
                  </li>
            </ul>
  </ul>


Скрипт, вроде бы, правильный. Он должен игнорировать быстрые перемещения мышки (кратковременные задержки мышки над пунктами разделов). И только лишь, когда мышка останавливается над пунктом раздела (class='ssylka_razd') более, чем на 0.8 секунды, срабатывает скрипт, чтобы плавно выкатить вложенные пункты и подразделы.

Однако, когда я, тестируя скрипт, быстро перемещаю мышку верх-вниз-верх-вниз по меню-аккордеону, некоторые пункты-разделы начинают раскрываться. Хотя, этого не должно происходить, потому что при быстрых осциляциях мышки, он не задерживается над пунктами разделов более 0.1-0.3 секунды.
______________________________

Подскажите, пожалуйста, как исправить мой скрипт, и в чем моя ошибка.
Чтобы увидеть воочию этот эффект, можете проверить меню-аккордеон на этой тестовой странице:

Если можно, дайте совет, без исправления html-кода моего примера.
Ответить с цитированием