--- /dev/null
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
+ <title>Bottom Tabs Example</title>
+ <!-- Ext includes -->
+ <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
+ <script type="text/javascript" src="../../bootstrap.js"></script>
+
+ <!-- Shared example includes -->
+ <link rel="stylesheet" type="text/css" href="../shared/example.css" />
+
+ <!-- Example includes -->
+ <link rel="stylesheet" type="text/css" href="tabs.css" />
+ <script type="text/javascript" src="bottom-tabs.js"></script>
+</head>
+<body>
+ <h1>Bottom Tab Panel Examples</h1>
+ <p>Note that the js and css is not minified so it is readable. See <a href="tabs-example.js">tabs-example.js</a> for the tab creation code
+ and <a href="tabs-example.css">tabs-example.css</a> for the css.</p>
+
+ <!-- container for the existing markup tabs -->
+ <div id="tabs1">
+ <div id="script" class="x-hide-display">
+ <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate
+ eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus.
+ <br/><br/>
+ Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis
+ vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna.</p>
+ </div>
+ <div id="markup" class="x-hide-display">
+ <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate
+ eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus.
+ Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis
+ vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna.
+ <br/><br/>
+ Aliquam commodo ullamcorper erat. Nullam vel justo in neque porttitor laoreet. Aenean lacus dui, consequat eu,
+ adipiscing eget, nonummy non, nisi. Morbi nunc est, dignissim non, ornare sed, luctus eu, massa. Vivamus eget
+ quam. Vivamus tincidunt diam nec urna. Curabitur velit.</p>
+ </div>
+ </div>
+
+ <br>
+
+ <h2>Tabs with no tab strip and a fixed height that scroll the content. Built entirely with javascript.</h2>
+
+ <ul class="list">
+ <li>Tab 1 is a normal tab with content passed when adding it.</li>
+ <li>Tab 2 is loaded via Ajax each time the panel is visually activated.</li>
+ <li>Tab 3 is loaded via Ajax only one time during panel construction. It was set up to pass parameters when loaded.</li>
+ <li>Tab 4 has an event listener attached.</li>
+ <li>Tab 5 is disabled.</li>
+ </ul>
+</body>
+</html>
\ No newline at end of file