啥也不说鸟,上代码,只要页面引用了相应的ext的js库,就能运行:
[code="js"]
Ext.onReady(function(){
var zoneButtonGroup = new Ext.ButtonGroup({
title:'地市',
columnWidth:.4,
columns:3,
height:140,
items:[{text: '北京'},{text: '东京'},{text: '巴黎'},{text: '伦敦'},{text: '纽约'}]
});
var dateButtonGroup = new Ext.ButtonGroup({
title: '时间',
columns:4,
columnWidth:.4,
height:140,
items: [
{text:'◀'},
{text:'2009',id:'yearButton',xtype:'label'},
{text:'年',xtype:'label'},
{text:'▶'},
{text: '1月'},
{text: '2月'},
{text: '3月'},
{text: '4月'},
{text: '5月'}
]
});
var operaButtonGroup = new Ext.ButtonGroup({
title:'操作',
columns: 1,
columnWidth:.2,
height:140,
items: [{text: '确定',height:30},{text: '取消',height:30}]
});
var zoneDatePanel = new Ext.Panel({
width:300,
height:140,
layout:'column',
tbar: [zoneButtonGroup,dateButtonGroup,operaButtonGroup]
});
var zoneDateWin = new Ext.Window({
id:'zoneDateWin',
layout:'fit',
width:310,
height:153,
border:false,
resizable:false,
autoScroll:true,
closable:false,
items:[zoneDatePanel]
});
zoneDateWin.show();
zoneDateWin.render(document.body);
});
[/code]
以下是我在不同浏览器的截图:
先看一个共同问题:
[img]/upload/attachment/136585/3f2f21cd-b171-3ac8-9a13-5944f9bc4ea3.jpg[/img]
2009怎么居中啊..我试图插入空格字符,或者插入xtype:'tbspacer',要么不行,要么就出现大量的空白,都不是我要的.
好了...先看IE的整体效果:
[img]/upload/attachment/136590/d46f1964-ef72-305f-8335-b099c7687847.jpg[/img]
效果马马虎虎吧.但是...
这是FF下的:
[img]/upload/attachment/136592/c3e50e1a-860b-3ea1-a15b-886ed485b7f5.jpg[/img]
出现了难看的滚动条,且右边多出来了一块
然后是chrome:
[img]/upload/attachment/136594/5e29c5fa-331f-38fc-a858-7eb88f6f06b8.jpg[/img]
更夸张了~
接着是safari:
[img]/upload/attachment/136596/dfe50d8b-8ca0-3074-9520-32be91847b78.jpg[/img]
最后,我最喜欢的opera:
[img]/upload/attachment/136598/b8ee6e87-fab4-3aa5-a9e4-eea0e94b3528.jpg[/img]
束手无策.不懂css,不明白为什么在各个浏览器之间差异的根源,不知咋优化..
[b]问题补充:[/b]
yourgame:
显示不是一样的啊..至少很明显有滚动条啊~
[b]问题补充:[/b]
我不需要在Panel中显示任何东西了...
布局是最外边一个window. 然后套一个panel.
panel 的tbar上是一些 按钮的组合.
需求是我点了一个地方,弹出一个窗口,里面有很多按钮可按~
这样,panel的内容就是多余的了.
我当面用了if..else if判断
if(Ext.isIE6){...}else if(Ext.isOpera){...}....
很无奈.
[b]问题补充:[/b]
[quote]var zoneDateWin = new Ext.Window({
id:'zoneDateWin',
layout:'fit',
width:310,
height:153,
border:false,
resizable:false,
autoScroll:true,
closable:false,
//items:[zoneDatePanel]
tbar: [zoneButtonGroup,dateButtonGroup,operaButtonGroup]
}); [/quote]
如果tbar放在window中..不知为啥.我只能看见window.看见不了tbar..