Запускайте jQuery slideDown при каждом наведении

Question

Запускайте jQuery slideDown при каждом наведении

0

Я новичок в jQuery, и я пытаюсь сделать список слайдов. У меня есть следующий скрипт:

<script>
$(document).ready(function() {
$('.menu>li').hover(function(){
$('.menu>li>ul').slideDown("slow");
});
});
</script>

Он сползает вниз по раскрывающемуся списку в первый раз после загрузки страницы, но после этого он просто появляется без скольжения вниз, пока страница не будет обновлена. Как я могу заставить его сползать на каждом паре? Я пробовал это, но это тоже не сработало:

<script>
$(document).ready(function() {
$('.menu>li').hover(function(){
$('.menu>li>ul').stop(true,true).slideDown("slow");
});
});
</script>

Вот веб-сайт, над которым я работаю, и вы можете навестить "области практики", чтобы видеть. Он по IP 72.41.8.193

Благодарю.

George Chanturidze 08 март 2014, в 00:42

Источник

0

Вы сдвигаете его обратно куда-нибудь еще?
Scottux 07 март 2014, в 22:53
0

Стоит прочитать: 2meter3.de/code/hoverFlow & css-tricks.com/examples/jQueryStop
JohanVdR 07 март 2014, в 23:05

Теги:

jquery

css

drop-down-menu

joomla3.0

slidedown

2 ответа

0

Возможно, вам придется немного реорганизовать часть вашего кода:

$('.menu > li').hover(function(){
    $(this).find('ul').stop().slideDown('slow'); 
}, function()
    $(this).find('ul').stop().slideUp('slow');
});

Вы захотите использовать this чтобы узнать, какой пункт меню WHICH вы тоже нависаете. .find('ul') получит следующую ближайшую ul из .menu > li. Всегда помните, чтобы остановить анимацию, чтобы она не пузырилась, а затем не забудьте использовать вторую функцию вашего зависания, чтобы что-то сделать, когда вы отключаетесь.

ntgCleaner 07 март 2014, в 21:34

Ещё вопросы

Вы сдвигаете его обратно куда-нибудь еще?
Стоит прочитать: 2meter3.de/code/hoverFlow & css-tricks.com/examples/jQueryStop

Mark F · Accepted Answer · 2014-03-07T20-48-00.000Z

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

Функция hover примет параметр мыши и мыши, попробуйте.

$(document).ready(function() {
    $('.menu>li').hover(function(){
        $('.menu>li>ul').stop(true,true).slideDown("slow");
    }, // <-- this comma is important. 
//the anonymous function after this will run on mouse out
    function(){
        $('.menu>li>ul').stop(true,true).slideUp("slow");
    });
});

Спасибо Марк, что работал отлично.