コンポーネントが最初にレンダリングされたとき、アコーディオン項目は短いです。何か良いアイデアはありますか?
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: '<empty panel>',
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>