diff --git a/demos/tooltip/forms.html b/demos/tooltip/forms.html
new file mode 100644
index 000000000..626161d6e
--- /dev/null
+++ b/demos/tooltip/forms.html
@@ -0,0 +1,69 @@
+
+
+
+ jQuery UI Tooltip - Default demo
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Hover the questionmark-buttons or use the button below to display the help texts all at once. Click again to hide them.
+
+
+
+
+
+
+
diff --git a/demos/tooltip/tracking.html b/demos/tooltip/tracking.html
new file mode 100644
index 000000000..9af4d0d09
--- /dev/null
+++ b/demos/tooltip/tracking.html
@@ -0,0 +1,65 @@
+
+
+
+ jQuery UI Tooltip - Default demo
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Tooltips can be attached to any element. When you hover
+ the element with your mouse, the title attribute is displayed in a little box next to the element, just like a native tooltip.
+
+
But as it's not a native tooltip, it can be styled. Any themes built with
+ ThemeRoller
+ will also style tooltip's accordingly.
+
Tooltip's are also useful for form elements, to show some additional information in the context of each field.
+
Your age:
+
Click the field to see the tooltip; when you tab out of the field, it gets hidden.
+
+
+
+
+
+
+
+
Here the tooltips are positioned relative to the mouse, and follow the mouse while it moves above the element.
+
+
+
+
+
+
+
diff --git a/tests/visual/compound/widgets_in_dialog.html b/tests/visual/compound/widgets_in_dialog.html
index 7551efd8d..e2eb366b4 100644
--- a/tests/visual/compound/widgets_in_dialog.html
+++ b/tests/visual/compound/widgets_in_dialog.html
@@ -20,8 +20,11 @@
+
@@ -76,11 +79,11 @@
Another button
- Progress:
+ Progress:
-
+
First
diff --git a/themes/base/jquery.ui.tooltip.css b/themes/base/jquery.ui.tooltip.css
index 2b01036b0..6d8e988bd 100644
--- a/themes/base/jquery.ui.tooltip.css
+++ b/themes/base/jquery.ui.tooltip.css
@@ -7,6 +7,7 @@
-webkit-box-shadow: 0 0 5px #aaa;
box-shadow: 0 0 5px #aaa;
}
+/* Fades and background-images don't work well together in IE6, drop the image */
* html .ui-tooltip {
background-image: none;
}
diff --git a/ui/jquery.ui.tooltip.js b/ui/jquery.ui.tooltip.js
index 1fe452450..166bff407 100644
--- a/ui/jquery.ui.tooltip.js
+++ b/ui/jquery.ui.tooltip.js
@@ -49,7 +49,7 @@ $.widget("ui.tooltip", {
this.opacity = this.tooltip.css("opacity");
this.element
.bind("focus.tooltip mouseenter.tooltip", function(event) {
- self.show($(event.target));
+ self.open();
})
.bind("blur.tooltip mouseleave.tooltip", function(event) {
self.close();
@@ -73,7 +73,8 @@ $.widget("ui.tooltip", {
return this.tooltip;
},
- show: function(target) {
+ open: function() {
+ var target = this.element;
// already visible? possible when both focus and mouseover events occur
if (this.current && this.current[0] == target[0])
return;
@@ -83,14 +84,14 @@ $.widget("ui.tooltip", {
var content = this.options.content.call(target[0], function(response) {
// ignore async responses that come in after the tooltip is already hidden
if (self.current == target)
- self.open(target, response);
+ self._show(target, response);
});
if (content) {
- self.open(target, content);
+ self._show(target, content);
}
},
- open: function(target, content) {
+ _show: function(target, content) {
if (!content)
return;
@@ -115,7 +116,7 @@ $.widget("ui.tooltip", {
else
this.tooltip.is(':visible') ? this.tooltip.fadeTo("normal", this.opacity) : this.tooltip.fadeIn();
- this._trigger("show", null, { target: target });
+ this._trigger( "open" );
},
close: function() {
@@ -136,6 +137,7 @@ $.widget("ui.tooltip", {
else
this.tooltip.stop().fadeOut();
+ this._trigger( "close" );
}
});