StickyWin.PointyTip

docs

This class takes the layout provided by StickyWin.ui.pointy and integrates it with StickyWin to make it really easy to make a tooltip show up next to an element. Check it out:

new StickyWin.PointyTip("Pointing Down", "I point down at the element", {
  point: 'down',
  relativeTo: 'pointyTipTarget'
});

Just like StickyWin.ui.pointy, you can tell the tip which way to point. In the above example we tell the tip to point down, which means the tip is above the element. We can use up/down/left/right as options, but we can also specify integers between 1 and 12 that correspond to the hands on a clock.

$('fxTarget').move().get('move').chain(function(){ /*center the target*/
 
	new StickyWin.PointyTip("Pointing Down", "I point down at the element", {
	  point: 6, /* same as 'down' */
	  relativeTo: 'fxTarget'
	});
 
	new StickyWin.PointyTip("Pointing Left", "I point left at the element", {
	  point: 9, /* same as 'left' */
	  pointyOptions: { theme: 'light' },
	  relativeTo: 'fxTarget'
	});
 
	new StickyWin.PointyTip("Pointing Up", "I point up at the element, with my pointer on the left.", {
	  point: 11,
	  relativeTo: 'fxTarget'
	});
 
	new StickyWin.PointyTip("Pointing Right", "I point right at the element, with my pointer at the bottom", {
	  point: 4, 
	  relativeTo: 'fxTarget'
	});
 
});

This class has all the options of StickyWin and access to all the options in StickyWin.ui.pointy and StickyWin.ui, so you can easily control things like width, offsets, etc.