проблемы с указанием мыши, уходом и наведением мыши

Question

проблемы с указанием мыши, уходом и наведением мыши

0

Автор сценария:

$( ".title").mouseenter(function() {
    var which = $(this).index();
    $('.globalnav li').find('.dropdown').hide().eq(which).show();
}).mouseleave(function() {
    var which = $(this).index();
    $('.globalnav li').find('.dropdown').hide().eq(which).hide();
});

Навигация:

<ul class="globalnav">
    <li>
        <div class="title"><a href="#" target="_self">Home</a></div>
        <div class="dropdown">
            <div class="navlinks">
                <div class="linkstitle">Title</div>
                <div class="navlink"><a href="#" target="_self">Link1</a></div>
                <div class="navlink"><a href="#" target="_self">Link1</a></div>
            </div>
        </div>
    </li>
...

Вышеприведенный код - это то, что я использую прямо сейчас, которое не работает в Chrome, как предполагалось. * Мне нужно держать мой клик, чтобы просмотреть div. Я использую mouseover, он не работает должным образом в IE и FF.

У меня также возникает проблема с отображением связанного div заголовка (в заголовке заголовка, show specific div) из-за характера самого формата кодирования (клиентский код). Прямо сейчас, при наведении указателя мыши на заголовок, он показывает первое содержимое li для "navlinks".

Здесь скрипка, чтобы показать вам

благодаря

eliavures 21 апр. 2014, в 16:23

Источник

Теги:

javascript

jquery

html

css

1 ответ

Ещё вопросы

adeneo · Accepted Answer · 2014-04-21T12-11-00.000Z

Почему вы используете индекс элемента .title, если другой LI выглядит так, which переменная всегда будет 0, и это не способ настроить правильную .dropdown?

Попробуйте что-нибудь еще

$( ".title").on('mouseenter mouseleave', function(e) {
    var dropdown = $(this).closest('li').find('.dropdown').toggle(e.type=='mouseenter');

    $('.dropdown').not(dropdown).hide();
});

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

<li>
    <div class="title">
        <a href="#" target="_self">Home</a>
        <div class="dropdown">
            <div class="navlinks">
                <div class="linkstitle">Title</div>
                <div class="navlink"><a href="#" target="_self">Link1</a></div>
                <div class="navlink"><a href="#" target="_self">Link1</a></div>
            </div>
        </div>
    </div>
</li>

FIDDLE

Первый работает как шарм, спасибо! Я бы +1 тебе, но мне не хватает представителя :( И ты знаешь, почему я должен держать нажатой, чтобы он работал в Chrome? Большое спасибо!
Не уверен, что предмет индекса выглядит действительно странным и странным, решение в ответе выше должно работать во всех ответах, но вы должны изменить HTML, если вы не хотите, чтобы раскрывающийся список исчезал, когда мышь покидает элемент заголовка и т. Д.