jQuery UI Tooltip, keep visible

Hello friends,

today I’ve found myself in the need of having the jQuery UI Tooltip always visible once the mouse is on over the tooltip anchor and the tooltip target.

After a while searching I’ve come up with this recipe.

	$(window).bind("load", function() {
		$(".toolticur").tooltip({
			show: null,
			position: {
				my: "left top",
				at: "left bottom"
			},
			open: function(event, ui) {
				ui.tooltip.animate({ top: ui.tooltip.position().top + 10 }, "fast" );

				if (typeof(event.originalEvent) === 'undefined'){
					return false;
				}

				var $id = $(ui.tooltip).attr('id');

				// close any lingering tooltips
				$('div.ui-tooltip').not('#' + $id).remove();

			},
			content: function() {
				return $(this).attr('title');
			},
			close: function(event, ui){
				ui.tooltip.hover(function(){
					$(this).stop(true).fadeTo(400, 1);
				},
				function(){
					$(this).fadeOut('400', function(){
						$(this).remove();
					});
				});
			}
		});
	});

If you’re in need for something similar, hope this helps you.