Раскрывающееся меню slideDown

Поэтому я пытаюсь сделать небольшой эффект в выпадающем меню, но я не знаю, как правильно использовать функции hover и slideDown

$('nav > div > ul > li').hover(function() {
    $('nav > div > ul > li > ul').stop(true, true).slideDown(200);
}, function() {
    $('nav > div > ul > li > ul').stop(true, true).slideUp(200);

});

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

РЕДАКТИРОВАТЬ: FIDDLE

2 ответа

Решение

Попробуйте эту скрипку

http://jsfiddle.net/MzJNT/2/

Я хотел бы предложить добавить идентификатор для селекторов, как показано ниже

JS $(документ).ready(function() {

$('#parent').hover(function() {
    $('#submenu').stop(true, true).slideDown(200);
}, function() {
    $('#submenu').stop(true, true).slideUp(200);

});

 });

Я уверен, что есть более эффективный способ сделать это, но это хорошее начало.

РЕДАКТИРОВАТЬ

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

Удали это...

     nav > div > ul > li:hover > ul {
     display: block;
     }

или попробуйте эту скрипку http://jsfiddle.net/MzJNT/9/

Вы можете просто добавить идентификатор в <li> это должно упасть.

HTML:

<li id="dropdown"><a href="#">Parent</a>

JQuery:

$('nav > div > ul > li#dropdown').hover(function() {

Скрипка: скрипка

Также вы можете проверить наличие <ul> внутри элемента:

JQuery:

$( document ).ready(function() {
    $('nav > div > ul > li').hover(function() {
        if (this.has('ul')) {
            $('nav > div > ul > li > ul').stop(true, true).slideDown(200);
        }
    }, function() {
        if (this.has('ul')) {
            $('nav > div > ul > li > ul').stop(true, true).slideUp(200);
        }
    });
});

Скрипка: скрипка

Затем вы можете проверить <li> в этом, если вы хотите быть действительно конкретным.

Другие вопросы по тегам