"> "> " />

Объекты, исчезающие с исчезающим кодом подменю - ошибка jQuery?

Я строю место и имею меню, у которого есть dropdowns. Из-за природы дизайна, я в настоящее время обнаруживаю, когда мышь по пункту меню; и покажите связанное подменю.

                                <div class="menu-responsibility menu-item">
                                            

                                                            <div class="sub-responsibility">
                                                                      
                                                            </div>
                            </div>

Вот JS, который я написал:

        /* NOTE: Visibility was added due to display objects being clickable with 0 opacity. */
$(".menu-click").hover(function() {
$(this).css('visibility', 'visible');
$(this).parent().css('visibility', 'visible');
$(this).parent().fadeTo("fast", 1);
}, function() {
if ($(this).parent().is(':hover')) {
//alert ("hovering");
} else {
    $(this).parent().fadeTo("fast", 0);
}
});

$(".menu-click").parent().mouseleave(function() {
$(this).fadeTo("fast", 0, function() {
   //this function will called after the opacity animation has completed
    $(this).delay(500).css('visibility', 'hidden');
});
});
    /*End Sub-Menu Function */

Это хорошо работало, просто исчезая; но когда непрозрачность была 0, и элементы были все еще видимы, по ним можно было щелкнуть (просто не замеченный), и это было недопустимо.

Ошибка: Иногда , полностью беспорядочно, часть государства парения меню (и примкнул к подменю) исчезает. Они больше не там и не могут быть подчеркнуты. Это беспорядочно произойдет с одним из пунктов меню, если вы будете управлять своей мышью через них быстро. Поджигатель показывает следующее, когда пункт меню "Результатов" делает это. Это больше не может подчеркиваться.

<div class="menu-home menu-item">
<div class="menu-services menu-item" style="visibility: hidden; opacity: 0;">
<div class="menu-results menu-item" style="opacity: 0; visibility: hidden;">
<div class="menu-clients menu-item" style="visibility: hidden; opacity: 0;">
<div class="menu-about menu-item" style="opacity: 0; visibility: hidden;">
<div class="menu-responsibility menu-item" style="opacity: 0; visibility: hidden;">
<div class="menu-contact menu-item">

Very strange bug, hopefully you guys can help! My Dev site is available and will probably help: http://www.kipdo.com

Thanks in advance!

0
nl ja de

1 ответы

Ваша проблема, вероятно, связана с тем, как вы используете .parent() функция.

Я предложил бы, чтобы вы скорее использовали .hide JQuery() и .show() функции вместо того, чтобы изменить действующий CSS. Другое предложение должно было бы использовать родительский признак, чтобы поддержать колебание/скрытие/показывание так, чтобы вы не имели дело с родителями никаких связей в вашем меню, в.

0
добавлено
Верстка сайтов HTML/CSS/JS/PHP
Верстка сайтов HTML/CSS/JS/PHP
3 439 участник(ов)

Правила группы: напишите !rules в чате. Группа Вк: vk.com/web_structure Freelancer: @web_fl Веб Дизайн: @dev_design Маркетолог: @topmarkening Автор: @M_Boroda