0

私は jQuery メニューバーを作成しています。すべてがうまくいっていますが、最初の項目にもサブメニューがあるサブメニューを持つ最上位のメニュー項目にマウスを合わせると、奇妙な効果が得られます。20 回ほどマウス インとマウス アウト ([表示] メニュー項目の上を左右に移動) すると、[表示] > [エンコーディング] サブサブメニューがますます右に移動するのが見え始めます。

メニューバーのデモ例の修正版で問題を再現できます。私はFirefox 20.0.1を使用しています。

ここを参照してください：http://jsfiddle.net/Njjgm/

サブサブメニューの右端を見つけて、同じサブサブメニューの新しい左端をその位置に設定していると思います...したがって、開始を遅くするか、配置計算を修正すると、そのバグは発生しないはずです.

jquery.ui.menubar.jsファイルを調べて、setTimeoutsを調整できるかどうか、またはサブサブメニューの位置を修正できるかどうかを確認していますが、うまくいきません。

私はこれを見ています（jquery.ui.menubar.jsの262行目から）：

__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 );
            }
        };

また、これで：（jquery.ui.menubar.js行68から）

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メニューバーの経験がある人は、これを見て修正しましたか? setTimeout の修正方法を知っている人はいますか? HoverIntent は、メニューバーと同じ set/clearTimeout 手法を使用しているように見えるため、メニューバーからすべてのロジックを削除して追加したくありません。提案は歓迎します。ありがとう。

4

1 に答える 1

0

問題の回避策を見つけましたが、バグのある位置を修正しませんでした (ただし、修正できる場所を見つけたと思います)。

コードはデフォルトで、開いたメニューの最初のリスト要素を選択し、その要素にもメニューがある場合は、そのメニューも開きます。最初の子要素にフォーカスを置くコードを取り出しました (なぜそれを行う必要があるのでしょうか?)

jquery.ui.menubar.js 行 451 から

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が、これでうまくいきました。

于 2013-05-09T17:19:05.930 に答える