JQuery UI Менубар Фантом Подменю Выпуск

Я создаю JQuery Menubar, и все выглядит хорошо, но я получаю странный эффект, когда я наводю курсор мыши на элемент меню верхнего уровня, который имеет подменю, где первый элемент также имеет подменю. Если я наведу курсор мыши (перемещаясь влево и вправо по пункту меню "Вид") примерно 20 раз, я начну видеть подменю "Вид"> "Кодировка", смещающееся все больше вправо.

Я могу воссоздать проблему с измененной версией демо-примера menubar. Я на Firefox 20.0.1.

Смотрите здесь: http://jsfiddle.net/Njjgm/

Я полагаю, что он находит правый край меню подподводки, а затем устанавливает новый левый край того же меню подподставки в эту позицию... Так что, если я замедляю открытие или исправляю математику позиционирования, то у меня не должно быть этой ошибки,

Я просматриваю файл jquery.ui.menubar.js, чтобы узнать, могу ли я настроить setTimeouts или исправить положение меню subub, но безуспешно.

Я смотрю на это (из строки 262 jquery.ui.menubar.js):

__applyMouseBehaviorForSubmenuHavingMenuItem: function (input, menubar) {

    var menu = input.next( menubar.options.menuElement ),
        mouseBehaviorCallback = function( event ) {
            // ignore triggered focus event
            if ( event.type === "focus" && !event.originalEvent ) {
                return;
            }

            if (event.type === "mouseenter") {

                this.element.find(":focus").focusout();
                if (this.stashedOpenMenu) {                     
                    this._open( event, menu);
                }
                this.stashedOpenMenu = undefined;
            }
            if ((this.open && event.type === "mouseenter") 
                               || this.options.autoExpand) {

                if (this.options.autoExpand) {

                    clearTimeout( this.closeTimer );
                }
                this._open( event, menu );
            }
        };

А также на это: (из строки 68 jquery.ui.menubar.js)

focusin: function( event ) {
            clearTimeout( menubar.closeTimer );
        },
        focusout: function( event ) {
            menubar.closeTimer = setTimeout (function() {
                menubar._close( event );
            }, 150 );
        },
        "mouseleave .ui-menubar-item": function( event ) {
            if ( menubar.options.autoExpand ) {
                menubar.closeTimer = setTimeout( function() {
                    menubar._close( event );
                }, 150 );
            }
        },
        "mouseenter .ui-menubar-item": function( event ) {
            clearTimeout( menubar.closeTimer );
        }

Кто-нибудь с опытом работы с jquery ui menubar видел и исправлял это раньше? Кто-нибудь знает исправление с setTimeout? HoverIntent, похоже, использует ту же технику set / clearTimeout, что и menubar, поэтому я не хочу извлекать всю логику из menubar, чтобы добавить это. Любые предложения приветствуются. Благодарю.

1 ответ

Ну, я нашел способ обойти эту проблему, хотя я не исправил ошибочное позиционирование (но, думаю, я нашел, где это можно исправить).

Код по умолчанию выбирает первый элемент списка в открывшемся меню, и если этот элемент также имеет меню, это меню также открывается. Я вынул код, который фокусируется на первом дочернем элементе (зачем это нужно делать?)

из строки 451 jquery.ui.menubar.js

this.active = menu
        .show()
        .position($.extend({
            of: button
        }, this.options.position));
        //.removeAttr("aria-hidden")
        //.attr("aria-expanded", "true")
        //.menu("focus", event, menu.children(".ui-menu-item").first() )
        // TODO need a comment here why both events are triggered
        //.focus()
        //.focusin();

И Престо-Чанго! Нет больше фантомных выпадающих меню... Я мог бы попытаться выяснить menu.position но это сработало для меня.

Другие вопросы по тегам