imported the whole jquery-ui package, refreshed with 1.10.2

[unfold.git] / third-party / jquery-ui-1.10.2 / demos / tooltip / forms.html
diff --git a/third-party/jquery-ui-1.10.2/demos/tooltip/forms.html b/third-party/jquery-ui-1.10.2/demos/tooltip/forms.html

new file mode 100644 (file)

index 0000000..a5ce77f
--- /dev/null
+++ b/third-party/jquery-ui-1.10.2/demos/tooltip/forms.html
@@ -0,0 +1,65 @@
+<!doctype html>
+<html lang="en">
+<head>
+       <meta charset="utf-8">
+       <title>jQuery UI Tooltip - Forms</title>
+       <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
+       <script src="../../jquery-1.9.1.js"></script>
+       <script src="../../ui/jquery.ui.core.js"></script>
+       <script src="../../ui/jquery.ui.widget.js"></script>
+       <script src="../../ui/jquery.ui.position.js"></script>
+       <script src="../../ui/jquery.ui.tooltip.js"></script>
+       <script src="../../ui/jquery.ui.button.js"></script>
+       <link rel="stylesheet" href="../demos.css">
+       <style>
+       label {
+               display: inline-block; width: 5em;
+       }
+       fieldset div {
+               margin-bottom: 2em;
+       }
+       fieldset .help {
+               display: inline-block;
+       }
+       .ui-tooltip {
+               width: 210px;
+       }
+       </style>
+       <script>
+       $(function() {
+               var tooltips = $( "[title]" ).tooltip();
+               $( "<button>" )
+                       .text( "Show help" )
+                       .button()
+                       .click(function() {
+                               tooltips.tooltip( "open" );
+                       })
+                       .insertAfter( "form" );
+       });
+       </script>
+</head>
+<body>
+
+<form>
+       <fieldset>
+               <div>
+                       <label for="firstname">Firstname</label>
+                       <input id="firstname" name="firstname" title="Please provide your firstname.">
+               </div>
+               <div>
+                       <label for="lastname">Lastname</label>
+                       <input id="lastname" name="lastname" title="Please provide also your lastname.">
+               </div>
+               <div>
+                       <label for="address">Address</label>
+                       <input id="address" name="address" title="Your home or work address.">
+               </div>
+       </fieldset>
+</form>
+
+<div class="demo-description">
+<p>Use the button below to display the help texts, or just focus or mouseover the indivdual inputs.</p>
+<p>A fixed width is defined in CSS to make the tooltips look consistent when displayed all at once.</p>
+</div>
+</body>
+</html>