2

组件首次渲染时手风琴项很短。有什么好主意吗?

我用的是chrome浏览器,用IE9好像没问题。

这是 jsfiddle 测试的 url:http: //jsfiddle.net/xgsZ7/2/。(可能jsfiddle测试需要再刷新一次才能看到问题)

这是测试代码:只是一个视口和一个呈现手风琴布局的面板。

<html >
<head>
<title>test</title>
<script type="text/javascript" src="http://cdn.sencha.io/ext-4.1.1-gpl/ext-all.js"> </script>
<link rel="stylesheet" type="text/css" href="http://cdn.sencha.io/ext-4.1.1-gpl/resources/css/ext-all.css" />
<script language="javascript">
    function createAccordion() {
        var item1 = Ext.create('Ext.Panel', {
          title: 'Accordion Item 1',
          html: '&lt;empty panel&gt;',
          cls:'empty'
        });

        var accordion = Ext.create('Ext.Panel', {
          title: 'Accordion',
          collapsible: true,
          margins:'5 0 5 5',
          region:'west',
          split: true,
          width: 210,
          layout:'accordion',
          items: [item1]
        });
        return accordion;
   }

function createBody() {
    var viewport = Ext.create('Ext.Viewport', {
      layout:'border',
      items:[
          createAccordion()
      ]
    });
}
</script>
</head>
<body>
<script>    
        createBody();
</script>
</body>
</html>
4

1 回答 1

0

使用 Ext.onready 进行渲染可以解决这个问题。( http://jsfiddle.net/xgsZ7/3/ )

<script>       
Ext.onReady(function() {
    createBody();
});
</script>
于 2013-02-28T09:30:21.453 回答