我正在创建一个 jQuery 菜单栏,一切看起来都很好,但是当我将鼠标悬停在具有子菜单的顶级菜单项上时,我得到了一种奇怪的效果,其中第一项也有子菜单。如果我将鼠标移入和移出(在 View 菜单项上左右移动)大约 20 次,我将开始看到 View>Encoding 子菜单越来越向右移动。
我可以使用菜单栏演示示例的修改版本重新创建问题。我在 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 menubar 经验的人见过并修复过这个问题?有人知道 setTimeout 的修复方法吗?HoverIntent 似乎使用与菜单栏相同的 set/clearTimeout 技术,所以我不想从菜单栏中删除所有逻辑来添加它。欢迎提出任何建议。谢谢。