Есть меню навигации, каждый пункт - div, один из пунктов - должен быть выпадающим, когда наводишь на него под ним появляется div id=sub_navigation
Обработчики hover:
$(document).ready(function() {
$("div.menu_items").hover (
function () {
if (id=='menu_3') {
$("div#sub_navigation").fadeIn(200);
}
$(this).find("div.m_background").fadeIn(200);
},
function () {
if (id=='menu_3') {
$("div#sub_navigation").fadeOut(200);
}
$(this).find("div.m_background").fadeOut(200);
}
}
);
$("div#sub_navigation").hover (
function () {
$(this).fadeIn(200);
$("div#menu_3").find("div.m_background").fadeIn(200);
},
function () {
$(this).fadeOut(200);
$("div#menu_3").find("div.m_background").fadeOut(200);
}
);
});
Проблема в том, что выпадающее меню и задний фон пункта основного меню появляются через fadeIn и когда я веду курсор от пункта основного меню к выпадающему, они сначала "затухают", а потом "появляются"... Если делать без fadeIn fadeOut - просто display: block, display: none - работает всё нормально... но нужно с анимацией... Подскажите пожалуйста решение.