問題は次のとおりです。メニューがあり、マウスが通り過ぎるときに要素を非表示にして表示したかったのですが、マウスオーバーとマウスアウトのイベントでそれを取得しましたが、実際には項目を選択できませんドロップダウンメニューが消えてしまうので、DOMの問題が原因かもしれないと思っていましたが、よくわかりません。助けていただければ幸いです! コードは次のようになります。
var PanelMuestra = Ext.extend(Ext.Panel, {
width : 850 ,
height : 250,
style : 'margin-top:15px',
bodyStyle: 'padding:10px',
renderTo : Ext.getBody(),
html : fakeHTML,
autoScroll: true
});
new PanelMuestra({
title: 'Menu',
tbar: [{
xtype:'splitbutton',
text: 'Nuevo aca',
listeners : {
mouseover : function() {
console.log('Dentro del area');
this.showMenu();
},
mouseout: function (b) {
console.log('Fuera del area');
b.hideMenu();
//Ext.menu.Manager.hideAll();
}
},
menu: [{text: 'Ejemplo boton 1'}]
},'-',{
xtype:'splitbutton',
text: 'Relleno',
menu: [{text: 'Cut Menu Item'}]
},'-',{
text: 'Relleno'
},'-',{
text: 'Relleno',
menu: [{
text: 'Cut Menu Item'
}]
},'-',{
text: 'Relleno'
}]
});