img - El menú jQuery Hover desaparece al hacer clic con el botón derecho

mouseleave jquery

Question

Tengo un menú que se abre al pasar el ratón. Pero al hacer clic derecho, el menú desaparece cuando se abre el menú contextual. Pero no puedo entender por qué. Necesito que el menú emergente se abra al mismo tiempo con menú contextual / clic derecho.

El código jQuery (Versión jquery-1.11.2.min.js):

    jQuery(document).on(''mouseover'',''#main_menu'',function() {

        jQuery(''#main_menu_inner'').show();

    });
    jQuery(document).on(''mouseleave'',''#main_menu'',function() {

        jQuery(''#main_menu_inner'').hide();

    });

El HTML:

<div id="main_menu">
    <img id="menu_button" src="/skin/images/all/structure/menu_button.png" alt="Men&uuml;" />
    <div id="main_menu_inner">
        <img id="menu_arrow" src="/skin/images/all/structure/main_menu_arrow_down.png" alt="Arrow" />
        <div class="clear_right"></div>
        <ul>
            <li>
                <a href="">Link</a>
            </li>
            <li>
                <a href="">Link</a>
            </li>
            <li>
                <a href="">Link</a>
            </li>
        </ul>
    </div>
</div>

Answer 1

Puede "piratear" el comportamiento mouseover / mouseleave al agregar un booleano para verificar si el menú contextual está abierto en el mouseleave eventos mouseleave . Esa no es una buena práctica, pero hace que su solicitud sea posible:

var contextMenuOpened = false;

$(document).on(''mouseover'', ''#main_menu'', function () {
    $(''#main_menu_inner'').show();
    contextMenuOpened = false;
});

$(document).on(''mouseleave'', ''#main_menu'', function () {
    $("#main_menu").on(''contextmenu'', function (e) {
        contextMenuOpened = true;
    });
    if (!contextMenuOpened) {
        $(''#main_menu_inner'').hide();
    }
});

Ejemplo en vivo