Upgrade to ExtJS 3.0.0 - Released 07/06/2009
[extjs.git] / docs / source / qtips.html
diff --git a/docs/source/qtips.html b/docs/source/qtips.html
new file mode 100644 (file)
index 0000000..b49a3d4
--- /dev/null
@@ -0,0 +1,78 @@
+<html>\r
+<head>\r
+  <title>The source code</title>\r
+    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
+    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
+</head>\r
+<body  onload="prettyPrint();">\r
+    <pre class="prettyprint lang-js">Ext.onReady(function(){\r
+    new Ext.ToolTip({\r
+        target: 'tip1',\r
+        html: 'A very simple tooltip'\r
+    });\r
+\r
+    new Ext.ToolTip({\r
+        target: 'ajax-tip',\r
+        width: 200,\r
+        autoLoad: {url: 'ajax-tip.html'},\r
+        dismissDelay: 15000 // auto hide after 15 seconds\r
+    });\r
+\r
+    new Ext.ToolTip({\r
+        target: 'tip2',\r
+        html: 'Click the X to close me',\r
+        title: 'My Tip Title',\r
+        autoHide: false,\r
+        closable: true,\r
+        draggable:true\r
+    });\r
+\r
+    new Ext.ToolTip({\r
+        target: 'track-tip',\r
+        title: 'Mouse Track',\r
+        width:200,\r
+        html: 'This tip will follow the mouse while it is over the element',\r
+        trackMouse:true\r
+    });\r
+    \r
+    new Ext.ToolTip({        \r
+        title: '<a href="#">Rich Content Tooltip</a>',\r
+        id: 'content-anchor-tip',\r
+        target: 'leftCallout',\r
+        anchor: 'left',\r
+        html: null,\r
+        width: 415,\r
+        autoHide: false,\r
+        closable: true,\r
+        contentEl: 'content-tip', // load content from the page\r
+        listeners: {\r
+            'render': function(){\r
+                this.header.on('click', function(e){\r
+                    e.stopEvent();\r
+                    Ext.Msg.alert('Link', 'Link to something interesting.');\r
+                    Ext.getCmp('content-anchor-tip').hide();\r
+                }, this, {delegate:'a'});\r
+            }\r
+        }\r
+    });\r
+    \r
+    new Ext.ToolTip({\r
+        target: 'bottomCallout',\r
+        anchor: 'top',\r
+        anchorOffset: 85, // center the anchor on the tooltip\r
+        html: 'This tip\'s anchor is centered'\r
+    });\r
+    \r
+    new Ext.ToolTip({\r
+        target: 'trackCallout',\r
+        anchor: 'right',\r
+        trackMouse: true,\r
+        html: 'Tracking while you move the mouse'\r
+    });\r
+\r
+\r
+    Ext.QuickTips.init();\r
+\r
+});</pre>    \r
+</body>\r
+</html>
\ No newline at end of file