diff options
Diffstat (limited to 'static/development-bundle/demos/accordion/default.html')
-rw-r--r-- | static/development-bundle/demos/accordion/default.html | 83 |
1 files changed, 83 insertions, 0 deletions
diff --git a/static/development-bundle/demos/accordion/default.html b/static/development-bundle/demos/accordion/default.html new file mode 100644 index 0000000..9493b26 --- /dev/null +++ b/static/development-bundle/demos/accordion/default.html | |||
@@ -0,0 +1,83 @@ | |||
1 | <!doctype html> | ||
2 | <html lang="en"> | ||
3 | <head> | ||
4 | <title>jQuery UI Accordion - Default functionality</title> | ||
5 | <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" /> | ||
6 | <script type="text/javascript" src="../../jquery-1.3.2.js"></script> | ||
7 | <script type="text/javascript" src="../../ui/ui.core.js"></script> | ||
8 | <script type="text/javascript" src="../../ui/ui.accordion.js"></script> | ||
9 | <link type="text/css" href="../demos.css" rel="stylesheet" /> | ||
10 | <script type="text/javascript"> | ||
11 | $(function() { | ||
12 | $("#accordion").accordion(); | ||
13 | }); | ||
14 | </script> | ||
15 | </head> | ||
16 | <body> | ||
17 | |||
18 | <div class="demo"> | ||
19 | |||
20 | <div id="accordion"> | ||
21 | <h3><a href="#">Section 1</a></h3> | ||
22 | <div> | ||
23 | <p> | ||
24 | Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer | ||
25 | ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit | ||
26 | amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut | ||
27 | odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate. | ||
28 | </p> | ||
29 | </div> | ||
30 | <h3><a href="#">Section 2</a></h3> | ||
31 | <div> | ||
32 | <p> | ||
33 | Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet | ||
34 | purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor | ||
35 | velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In | ||
36 | suscipit faucibus urna. | ||
37 | </p> | ||
38 | </div> | ||
39 | <h3><a href="#">Section 3</a></h3> | ||
40 | <div> | ||
41 | <p> | ||
42 | Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. | ||
43 | Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero | ||
44 | ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis | ||
45 | lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. | ||
46 | </p> | ||
47 | <ul> | ||
48 | <li>List item one</li> | ||
49 | <li>List item two</li> | ||
50 | <li>List item three</li> | ||
51 | </ul> | ||
52 | </div> | ||
53 | <h3><a href="#">Section 4</a></h3> | ||
54 | <div> | ||
55 | <p> | ||
56 | Cras dictum. Pellentesque habitant morbi tristique senectus et netus | ||
57 | et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in | ||
58 | faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia | ||
59 | mauris vel est. | ||
60 | </p> | ||
61 | <p> | ||
62 | Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. | ||
63 | Class aptent taciti sociosqu ad litora torquent per conubia nostra, per | ||
64 | inceptos himenaeos. | ||
65 | </p> | ||
66 | </div> | ||
67 | </div> | ||
68 | |||
69 | </div><!-- End demo --> | ||
70 | |||
71 | <div class="demo-description"> | ||
72 | <p> | ||
73 | Click headers to expand/collapse content that is broken into logical sections, much like tabs. | ||
74 | Optionally, toggle sections open/closed on mouseover. | ||
75 | </p> | ||
76 | <p> | ||
77 | The underlying HTML markup is a series of headers (H3 tags) and content divs so the content is | ||
78 | usable without JavaScript. | ||
79 | </p> | ||
80 | </div><!-- End demo-description --> | ||
81 | |||
82 | </body> | ||
83 | </html> | ||