source: trunk/web/addons/job_monarch/lib/extjs/examples/layout/accordion.html @ 619

Last change on this file since 619 was 619, checked in by ramonb, 15 years ago

lib/:

  • added new AJAX dependancies: ExtJS, pChart, Lightbox2
File size: 2.5 KB
Line 
1<html>
2<head>
3    <title>Accordion Layout</title>
4    <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css"/>
5
6    <!-- GC -->
7    <!-- LIBS -->
8    <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
9    <!-- ENDLIBS -->
10
11    <script type="text/javascript" src="../../ext-all.js"></script>
12
13    <style type="text/css">
14        html, body {
15            font: normal 12px verdana;
16            margin: 0;
17            padding: 0;
18            border: 0 none;
19            overflow: hidden;
20            height: 100%;
21        }
22        .empty .x-panel-body {
23            padding-top:20px;
24            text-align:center;
25            font-style:italic;
26            color: gray;
27            font-size:11px;
28        }
29    </style>
30    <script type="text/javascript">
31        Ext.onReady(function() {
32
33            var item1 = new Ext.Panel({
34                title: 'Accordion Item 1',
35                html: '&lt;empty panel&gt;',
36                cls:'empty'
37            });
38
39            var item2 = new Ext.Panel({
40                title: 'Accordion Item 2',
41                html: '&lt;empty panel&gt;',
42                cls:'empty'
43            });
44
45            var item3 = new Ext.Panel({
46                title: 'Accordion Item 3',
47                html: '&lt;empty panel&gt;',
48                cls:'empty'
49            });
50
51            var item4 = new Ext.Panel({
52                title: 'Accordion Item 4',
53                html: '&lt;empty panel&gt;',
54                cls:'empty'
55            });
56
57            var item5 = new Ext.Panel({
58                title: 'Accordion Item 5',
59                html: '&lt;empty panel&gt;',
60                cls:'empty'
61            });
62
63            var accordion = new Ext.Panel({
64                region:'west',
65                margins:'5 0 5 5',
66                split:true,
67                width: 210,
68                layout:'accordion',
69                items: [item1, item2, item3, item4, item5]
70            });
71
72            var viewport = new Ext.Viewport({
73                layout:'border',
74                items:[
75                    accordion, {
76                    region:'center',
77                    margins:'5 5 5 0',
78                    cls:'empty',
79                    bodyStyle:'background:#f1f1f1',
80                    html:'<br/><br/>&lt;empty center panel&gt;'
81                }]
82            });
83        });
84    </script>
85</head>
86<body>
87<script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->
88</body>
89</html>
Note: See TracBrowser for help on using the repository browser.