2
我正在創建一個工具欄，然後將它添加到ExtJS的Panel中。除IE7外，它看起來很棒，它比其他瀏覽器的高度大得多。 ExtJS以內聯CSS樣式對高度進行硬編碼。某些菜單是在工具欄之前創建的...ExtJS工具欄高度在IE7中不正確
var menu = Ext.create('Ext.menu.Menu', {
id: 'mainMenu',
style: {
overflow: 'visible'
},
items: [
{
text: 'choice1'
},{
text: 'choice2'
},{
text: 'choice3'
}]
});
var tb = Ext.create('Ext.toolbar.Toolbar');
tb.suspendLayouts();
tb.add({
text:'Choice 1',
iconCls: 'bmenu',
menu: menu
},{
xtype: 'tbfill'
},{
xtype: 'tbtext',
text: 'Last name'
});
menu.add(' ');
tb.add('-', {
iconCls: 'icon-help',
clickEvent: 'mousedown'
});
tb.resumeLayouts(true);
var viewport = new Ext.Viewport({
layout: 'border',
renderTo: Ext.getBody(),
items: [{
region: 'north',
id: 'North',
items: [{
region: 'center',
style: {
overflow: 'visible'
},
}, tb]
},{
region: 'west',
id: 'West',
xtype: 'panel',
layout: 'vbox',
collapsible: true,
split: true,
width: 200,
items: [{
xtype: 'panel',
id: 'upperWest',
width: 200,
flex: 1,
html: myAlerts
},{
xtype: 'panel',
id: 'lowerWest',
width: 200,
flex: 3,
html: quickView
}
]
]
},{
region: 'center',
id: 'center',
height: '100%',
minheight: 200,
minwidth: 200,
layout: 'border',
border: false,
autoScroll:true,
tbar: [
{xtype: 'tbfill'},
{
xtype: 'combo',
height: 20,
editable: false,
store: [
'choice1',
'choice2',
'choice3',
],
value: 'choice1'
},
{xtype: 'tbfill'}
],
items: [{
region: 'east',
id: 'center-east',
height: '100%',
minheight: 200,
width: 200,
items: barChartPanel
},{
region: 'center',
id: 'center-center',
layout: 'fit',
baseCls:'x-plain',
items: columnChartPanel
}]
},{
region: 'east',
id: 'moreOptions',
xtype: 'panel',
title: 'More Options',
collapsible: true,
split: true,
width: 200,
items: [
{xtype: 'panel',
id: 'rightPanel1',
collapsible: true,
collapsed: true,
}
]
},{
region: 'south',
xtype: 'container',
}]
});