examples/simple-widgets/qtips.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">\r
   2 <html>\r
   3 <head>\r
   4     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">\r
   5     <title>Tips Example</title>\r
   6     <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />\r
   7 \r
   8     <!-- GC -->\r
   9         <!-- LIBS -->\r
  10         <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
  11         <!-- ENDLIBS -->\r
  12 \r
  13 \r
  14     <script type="text/javascript" src="../../ext-all.js"></script>\r
  15 \r
  16     <link rel="stylesheet" type="text/css" href="qtips.css" />\r
  17     <script type="text/javascript" src="qtips.js"></script>\r
  18 \r
  19     <style type="text/css">\r
  20         .tip-target {\r
  21             width: 100px;\r
  22             text-align:center;\r
  23             padding: 5px 0;\r
  24             border:1px dotted #99bbe8;\r
  25             background:#dfe8f6;\r
  26             color: #15428b;\r
  27             cursor:default;\r
  28             margin:10px;\r
  29             font:bold 11px tahoma,arial,sans-serif;\r
  30             float:left;\r
  31         }\r
  32     </style>\r
  33 \r
  34     <!-- Common Styles for the examples -->\r
  35     <link rel="stylesheet" type="text/css" href="../shared/examples.css" />\r
  36 </head>\r
  37 <body>\r
  38 <script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
  39 \r
  40     <h1>Tips examples</h1>\r
  41     <p>Note that the js and css is not minified so it is readable. See <a href="qtips.js">qtips.js</a> for the tip creation code\r
  42     and <a href="qtips.css">qtips.css</a> for the css.</p>\r
  43 \r
  44     <h3>Easiest Tip</h3>\r
  45     <div id="tip1" class="tip-target">Basic ToolTip</div>\r
  46     <div id="tip2" class="tip-target">autoHide disabled</div>\r
  47     <div id="ajax-tip" class="tip-target">Ajax ToolTip</div>\r
  48     <div id="track-tip" class="tip-target">Mouse Track</div>\r
  49     <div id="tip4" class="tip-target" ext:qtip="My QuickTip">QuickTip</div>\r
  50 </body>\r
  51 </html>