Home  >  Article  >  Web Front-end  >  Learn ExtJS accordion layout_extjs

Learn ExtJS accordion layout_extjs

WBOY
WBOYOriginal
2016-05-16 18:45:091167browse

1. Accordion layout is defined by the class Ext.layout.Accordion, which represents a collapsible layout. Clicking the header name of each sub-element or the button on the right will expand the panel and shrink other expanded panels.
layoutConfig: true means to start the animation effect when expanding and folding, the default value is false.
2. Application examples

Copy code The code is as follows:

Ext.onReady(function (){
var _panel = new Ext.Panel({
title:"Personnel Information",
renderTo:Ext.getBody(),
frame:true,
width:500,
height:300,
layout:"accordion",
layoutConfig: {
animate: true
},
items:[{title:"child element 1",html: "This is the content in child element 1"},
{title:"child element 2",html:"This is the content in child element 2"},
{title:"child element 3", html: "This is the content in child element 3"}
]
}
);
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn