fdm
23 Dec 2009, 5:17 AM
Hello,
I have a page structured with a layout 'border'. My west panel is collapsible.
By default, when I click on the titlebar when the west panel is collapsed, it slide out over the center panel.
I wish the same working on the 'mouseover' event.
Here, my west panel definition and my listener for the 'mouseover' event :
var west = new Ext.Panel({
region: 'west',
id: 'west-panel',
title: 'West',
split: true,
width: 200,
minSize: 175,
maxSize: 400,
collapsible: true,
titleCollapse: true,
margins: '0 0 0 5',
layout: {
type: 'accordion',
animate: true
},
items: [{
contentEl: 'west',
title: 'Navigation',
border: false,
iconCls: 'nav'
}, {
title: 'Settings',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
}]
});
Ext.get("west-panel-xcollapsed").on('mouseover', function(){
if (west.collapsed) {
west.slideOut();
}
});
This doesn't work. 'west.slideOut()' does anything.
Anyone see how do it ?
I have a page structured with a layout 'border'. My west panel is collapsible.
By default, when I click on the titlebar when the west panel is collapsed, it slide out over the center panel.
I wish the same working on the 'mouseover' event.
Here, my west panel definition and my listener for the 'mouseover' event :
var west = new Ext.Panel({
region: 'west',
id: 'west-panel',
title: 'West',
split: true,
width: 200,
minSize: 175,
maxSize: 400,
collapsible: true,
titleCollapse: true,
margins: '0 0 0 5',
layout: {
type: 'accordion',
animate: true
},
items: [{
contentEl: 'west',
title: 'Navigation',
border: false,
iconCls: 'nav'
}, {
title: 'Settings',
html: '<p>Some settings in here.</p>',
border: false,
iconCls: 'settings'
}]
});
Ext.get("west-panel-xcollapsed").on('mouseover', function(){
if (west.collapsed) {
west.slideOut();
}
});
This doesn't work. 'west.slideOut()' does anything.
Anyone see how do it ?