Overhaul tooltip implementation. Avoid queuing and other problems by

creating the tooltip element on the fly, never reusing it.
Use aria-describedby attribute to find the associated tooltip again.
Allows customizing animations much easier (just replace fadeIn/fadeOut),
still open.
Updated demos and visual test to replace now-missing .widget() method.
Added tooltipClass for that.

3 files changed, 12 insertions, 9 deletions

diff --git a/demos/tooltip/custom-animation.html b/demos/tooltip/custom-animation.html
index a9d0df66e..a9745a062 100644
--- a/demos/tooltip/custom-animation.html
+++ b/demos/tooltip/custom-animation.html
@@ -11,12 +11,15 @@
 	<link type="text/css" href="../demos.css" rel="stylesheet" />
 	<script type="text/javascript">
 	$(function() {
+		// TODO overhaul this with custom animation API
 		$(".demo").tooltip({
 			open: function() {
-				$(this).tooltip("widget").stop(false, true).hide().slideDown();
+				$(".ui-tooltip").stop(false, true).hide().slideDown();
 			},
 			close: function() {
-				$(this).tooltip("widget").stop(false, true).show().slideUp();
+				$(".ui-tooltip").stop(false, false).show().slideUp(function() {
+					$(this).remove();
+				});
 			}
 		});
 	});
diff --git a/demos/tooltip/index.html b/demos/tooltip/index.html
index 6bc9c1e5c..3563350c5 100644
--- a/demos/tooltip/index.html
+++ b/demos/tooltip/index.html
@@ -14,6 +14,7 @@
 		<li><a href="tracking.html">Track the mouse</a></li>
 		<li><a href="custom-animation.html">Custom animation</a></li>
 		<li><a href="delegation-mixbag.html">Delegation Mixbag</a></li>
+		<li><a href="lots.html">Lots</a></li>
 	</ul>
 </div>
 
diff --git a/demos/tooltip/tracking.html b/demos/tooltip/tracking.html
index e3bb19e74..dd5dc9d92 100644
--- a/demos/tooltip/tracking.html
+++ b/demos/tooltip/tracking.html
@@ -13,12 +13,11 @@
 	$(function() {
 		$(".demo").tooltip({
 			open: function() {
-				var tooltip = $(this).tooltip("widget");
-				$(document).mousemove(function(event) {
-					tooltip.position({
-						my: "left center",
-						at: "right center",
-						offset: "25 25",
+				var tooltip = $( ".ui-tooltip" );
+				$(document).mousemove(function( event ) {
+					tooltip.position( {
+						my: "left+25 center",
+						at: "right+25 center",
 						of: event
 					});
 				})
@@ -26,7 +25,7 @@
 				.mousemove();
 			},
 			close: function() {
-				$(document).unbind("mousemove");
+				$(document).unbind( "mousemove" );
 			}
 		});
 	});