Как исправить это раскрывающееся меню JQuery?

Question

Я попытался создать выпадающее меню в JQuery, но это довольно сложно.

Мой код здесь:

$(document).ready(function(){ 

     $('ul li').mouseover(function() 
     { 
       $(this).children("ul").show(); 
     }); 
     $('ul li ul').mouseover(function() 
     { 
       $('ul li ul').show(); 
     }).mouseout(function(){ 
       $('ul li ul').hide(); 
     }); 

    }); 

В основном я хочу парить над элемент списка и подменю ул, чтобы опуститься, то я могу зависать над элементами списка и если мышь уходит из суб nav, меню снова скрывается.

спасибо, Keith

UPDATE: Я удалил границы с CSS и она отлично работает, так что появляется MouseOut срабатывает, когда я наведите курсор мыши на границе 1px, довольно странно.

Answer 1

Знаете ли вы, superfish? Это меню jQuery plug-in с отличной поддержкой кросс-браузера. У вас определенно нет проблемы, с которой вы сталкиваетесь. Я не проверял исходный код, но ключевое различие заключается в том, что он добавляет задержку в mouseout. Это означает, что действие не запускается, если положение курсора не стабилизируется в течение некоторого времени (по умолчанию - 800 мс). Это решит вашу проблему, и это также хорошо для реализации, так как это сделает ваше меню более удобным для пользователя.

Answer 2

вы должны использовать jQuery's hover() function как это позволяет избежать всех Сорта браузера конкретных проблем ..

Без лизать тестирования я предположил бы, что код будет выглядеть больше как:

$('.clearfix li').hover(function() { 
      $('ul', this).show(); 
     }, function() { 
      $('ul', this).hide(); 
     }); 

Answer 3

Проблема в том, что граница «снаружи» коробки. Это помогает, если вы просто перемещаете раскрывающееся меню на 1 пиксель, чтобы он перекрывал строку меню на 1 пиксель.

Просто измените верхнюю позицию в раскрывающемся меню в вашем CSS от 30px до 29px так:

 ul li ul { 
      border: none; 
      position: absolute; 
      top: 29px; /* <-- was 30px */ 

Answer 4

Он отлично работает на моей версии Firefox 1.5.0.1 Возможно, вы не имеете последнюю версию , Я сам запускаю галерею изображений, но я не думаю, что тип макета будет очень хорошо работать для меня, поскольку у меня есть описания для моих изображений, а некоторые из изображений довольно большие. Я не знаю, возможно, стоит поэкспериментировать.