Привет, команда переполнения стека,
Быстрый вопрос, который всегда возникает при создании пользовательских выпадающих навигационных систем с использованием jquery. Теперь идеальным сценарием для выпадающих меню было бы иметь родителей и детей в тегах
, однако иногда дизайн сайта не позволяет этого.
Допустим, у вас есть DIV, содержащий ваши основные элементы навигации, и еще один, содержащий ваши дочерние меню.
Когда вы перемещаете родительский элемент, дочернее меню появляется, однако, когда они являются отдельными, состояние развертывания становится сложным. Поэтому я вложил парения, чтобы попытаться обойти это, и почти все работает.
$("div.primary-nav").mouseenter(function () {
clearTimeout($(this).data('timeoutId'));
$("div.doormat-nav-wrapper").slideDown("slow");
}).mouseleave(function () {
$("div.doormat-nav-wrapper").mouseenter(function () {
clearTimeout($(this).data('timeoutId'));
$("div.doormat-nav-wrapper").slideDown("slow");
}).mouseleave(function () {
var someelement = this;
var timeoutId = setTimeout(function(){
$("div.doormat-nav-wrapper").slideUp("slow");
$(someelement).data('timeoutId', timeoutId); //set the timeoutId, allowing us to clear this trigger if the mouse comes back over
});
});
});
По логике вещей я пытаюсь достичь
Когда пользователь переворачивает div.primary-nav .... div.doormat-nav-wrapper показывает ... при откате основной nav div.doormat-nav-wrapper скрывает UNLESS div.doormat-nav- Сама обертка накрывается.
Любые отзывы или предложения будут с благодарностью. СПАСИБО!