-<html>\r
-<head>\r
- <title>Accordion Layout</title>\r
- <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css"/>\r
-\r
- <!-- GC -->\r
- <!-- LIBS -->\r
- <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
- <!-- ENDLIBS -->\r
-\r
- <script type="text/javascript" src="../../ext-all.js"></script>\r
-\r
- <style type="text/css">\r
- html, body {\r
- font: normal 12px verdana;\r
- margin: 0;\r
- padding: 0;\r
- border: 0 none;\r
- overflow: hidden;\r
- height: 100%;\r
- }\r
- .empty .x-panel-body {\r
- padding-top:20px;\r
- text-align:center;\r
- font-style:italic;\r
- color: gray;\r
- font-size:11px;\r
- }\r
- </style>\r
- <script type="text/javascript">\r
- Ext.onReady(function() {\r
-\r
- var item1 = new Ext.Panel({\r
- title: 'Accordion Item 1',\r
- html: '<empty panel>',\r
- cls:'empty'\r
- });\r
-\r
- var item2 = new Ext.Panel({\r
- title: 'Accordion Item 2',\r
- html: '<empty panel>',\r
- cls:'empty'\r
- });\r
-\r
- var item3 = new Ext.Panel({\r
- title: 'Accordion Item 3',\r
- html: '<empty panel>',\r
- cls:'empty'\r
- });\r
-\r
- var item4 = new Ext.Panel({\r
- title: 'Accordion Item 4',\r
- html: '<empty panel>',\r
- cls:'empty'\r
- });\r
-\r
- var item5 = new Ext.Panel({\r
- title: 'Accordion Item 5',\r
- html: '<empty panel>',\r
- cls:'empty'\r
- });\r
-\r
- var accordion = new Ext.Panel({\r
- region:'west',\r
- margins:'5 0 5 5',\r
- split:true,\r
- width: 210,\r
- layout:'accordion',\r
- items: [item1, item2, item3, item4, item5]\r
- });\r
-\r
- var viewport = new Ext.Viewport({\r
- layout:'border',\r
- items:[\r
- accordion, {\r
- region:'center',\r
- margins:'5 5 5 0',\r
- cls:'empty',\r
- bodyStyle:'background:#f1f1f1',\r
- html:'<br/><br/><empty center panel>'\r
- }]\r
- });\r
- });\r
- </script>\r
-</head>\r
-<body>\r
-<script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
-</body>\r
-</html>\r
+<html>
+<head>
+ <title>Accordion Layout</title>
+ <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css"/>
+
+ <!-- GC -->
+ <!-- LIBS -->
+ <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
+ <!-- ENDLIBS -->
+
+ <script type="text/javascript" src="../../ext-all.js"></script>
+
+ <style type="text/css">
+ html, body {
+ font: normal 12px verdana;
+ margin: 0;
+ padding: 0;
+ border: 0 none;
+ overflow: hidden;
+ height: 100%;
+ }
+ .empty .x-panel-body {
+ padding-top:20px;
+ text-align:center;
+ font-style:italic;
+ color: gray;
+ font-size:11px;
+ }
+ </style>
+ <script type="text/javascript">
+ Ext.onReady(function() {
+
+ var item1 = new Ext.Panel({
+ title: 'Accordion Item 1',
+ html: '<empty panel>',
+ cls:'empty'
+ });
+
+ var item2 = new Ext.Panel({
+ title: 'Accordion Item 2',
+ html: '<empty panel>',
+ cls:'empty'
+ });
+
+ var item3 = new Ext.Panel({
+ title: 'Accordion Item 3',
+ html: '<empty panel>',
+ cls:'empty'
+ });
+
+ var item4 = new Ext.Panel({
+ title: 'Accordion Item 4',
+ html: '<empty panel>',
+ cls:'empty'
+ });
+
+ var item5 = new Ext.Panel({
+ title: 'Accordion Item 5',
+ html: '<empty panel>',
+ cls:'empty'
+ });
+
+ var accordion = new Ext.Panel({
+ region:'west',
+ margins:'5 0 5 5',
+ split:true,
+ width: 210,
+ layout:'accordion',
+ items: [item1, item2, item3, item4, item5]
+ });
+
+ var viewport = new Ext.Viewport({
+ layout:'border',
+ items:[
+ accordion, {
+ region:'center',
+ margins:'5 5 5 0',
+ cls:'empty',
+ bodyStyle:'background:#f1f1f1',
+ html:'<br/><br/><empty center panel>'
+ }]
+ });
+ });
+ </script>
+</head>
+<body>
+<script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->
+</body>
+</html>