"right" class missing for feedback.horizontal in ui.tooltip

[simon.ferndriger]

When initializing jQuery UI Tooltip as follows:

$(document).tooltip({
		show: true,
		hide: false,
		position: {
			my: 'center top',
			at: 'center bottom+7.5',
			using: function(position, feedback){
				$(this).css(position);
				$(this).addClass(feedback.horizontal);
				$(this).addClass(feedback.vertical);
			}
		}
	 });

The horizontal feedback for tooltips works just fine for most elements, the .ui-tooltip receives the class .left resp. .right. However, for elements inside a fixed positioned header, this does not work.

Example: ​http://lookr.com/1249043220

• It works when you move the mouse from below over the left side menu and keep the mouse at the border. Then the tooltip appears with a pointer on the left side
• It does NOT work for the "scroll-to-top" link on the top right corner in the fixed header navigation. The pointer appears in the middle like with the regular inline tooltips, because the container (.ui-tooltip) does not receive the left/right class.

[Scott González]

We'll need a reduced test case showing the problem. We don't debug full sites.

[simon.ferndriger]

Of course. I finally succeeded in isolating a proper test case: ​http://jsfiddle.net/7DRH9/2/

Seems that it fails to trigger the "right" class because of the padding. If you leave it out, it works at least partially ("left" is added as feedback instead of "right"), but at least there is some feedback.

[Scott González]

Looking at that fiddle, the top tooltip looks like it's centered pretty well under the orange block, so there's no reason for the right class to be added. The classes are based on a scale, not based on whether the tooltip was moved a singled pixel. You can use the left, top, width, and height properties if you need more granular control.

[simon.ferndriger]

OK, you are right, the example was unfortunately not reproducing the case as on Lookr. Seems to be very hard to find out what the (complex) setting might be. However, if you remove the padding on Lookr of the corresponding <a> element, the tooltip works and adds the '.right' class. But as you mentioned, you probably are not interested in a case on a full website.

However, in trying to reproduce this error, I found a new one - if you look closely, you can see that the wrong horizontal class is added ('.left' instead of '.right'). I updated the previous fiddle to show this: ​http://jsfiddle.net/7DRH9/4/

[Scott González]

Please create a new ticket for the new issue. If possible, please reduce to using just the position plugin since that's where the problem is.