examples/window/hello.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3 <head>
   4 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
   5     <title>Hello World Window Example</title>
   6     <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
   7
   8     <!-- GC -->
   9         <!-- LIBS -->
  10         <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
  11         <!-- ENDLIBS -->
  12
  13     <script type="text/javascript" src="../../ext-all.js"></script>
  14
  15     <script language="javascript" src="hello.js"></script>
  16
  17 <!-- Common Styles for the examples -->
  18 <link rel="stylesheet" type="text/css" href="../shared/examples.css" />
  19
  20     <style type="text/css">
  21     .x-panel-body p {
  22         margin:10px;
  23         font-size:12px;
  24     }
  25     </style>
  26 </head>
  27 <body>
  28 <script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->
  29
  30 <h1>Hello World Window</h1>
  31 <p>This example shows how to create a very simple modal Window with "autoTabs" from existing markup.</p>
  32 <input type="button" id="show-btn" value="Hello World" /><br /><br />
  33 <p>Note that the js is not minified so it is readable. See <a href="hello.js">hello.js</a> for the full source code.</p>
  34
  35 <div id="hello-win" class="x-hidden">
  36     <div class="x-window-header">Hello Dialog</div>
  37     <div id="hello-tabs">
  38         <!-- Auto create tab 1 -->
  39         <div class="x-tab" title="Hello World 1">
  40             <p>Hello...</p>
  41         </div>
  42         <!-- Auto create tab 2 -->
  43         <div class="x-tab" title="Hello World 2">
  44             <p>... World!</p>
  45         </div>
  46     </div>
  47 </div>
  48 </body>
  49 </html>