выпадающий список с потерей индексации, если отсутствует дочерний элемент

Question

выпадающий список с потерей индексации, если отсутствует дочерний элемент

0

Я пытаюсь создать простое раскрывающееся меню, но мне не хватает индексации, если родительский div не хватает детей, которые я показываю и скрываю. Этот сценарий появляется, если есть пункт меню, который не имеет выпадающего списка, но является частью навигации.

Вот мой js

$('.catMain').removeClass('active');

$('.catMainHolder').mouseover(function () {
    $('.subCat').eq($(this).index()).show();
    $('.catMain').eq($(this).index()).addClass('active');
});
$('.catMainHolder').mouseout(function () {
    $('.subCat').eq($(this).index()).hide();
    $('.catMain').removeClass('active');
});

вот скрипка

http://jsfiddle.net/sghoush1/b7kVk/7/

soum 28 март 2014, в 18:27

Источник

Теги:

jquery

2 ответа

0

Попробуй это:

$('.catMain').removeClass('active');
$('.catMainHolder').mouseover(function () {
$(this).find('.subCat').show();
$(this).find('.catMain').addClass('active');
//$('.subCat').eq($(this).index()).show();
//$('.catMain').eq($(this).index()).addClass('active');
});
$('.catMainHolder').mouseout(function () {
$(this).find('.subCat').hide();
$(this).find('.catMain').removeClass('active');
//$('.subCat').eq($(this).index()).hide();
//$('.catMain').removeClass('active');
});

скрипка

razielx4crazy 28 март 2014, в 15:44

Ещё вопросы

Arun P Johny · Accepted Answer · 2014-03-28T14-02-00.000Z

Вы можете нацелить относительные элементы, используя this как - вы можете настроить таргетинг на subCat и catMain элементы внутри наведен catMainHolder элемента.

$('.catMainHolder').has('.subCat').hover(function () {
    $('.subCat', this).show();
    $('.catMain', this).addClass('active');
}, function () {
    $('.subCat', this).hide();
    $('.catMain.active').removeClass('active');
});

Демо: скрипка

Также вы можете настроить только те элементы catMainHolder которых есть subCat для события hover, используя .has(), как показано выше. Или используйте: has(), как $('.catMainHolder:has(.subCat)').hover(..);

@ Арун - отлично работал - спасибо!