YUI3 Tooltip and Popover

What is it?

Y.Twipsy is a tooltip for the YUI3 Library. It is built to replicate the functionality of Twipsy, the popular tooltip used in Twitter's Bootstrap.

Y.Popover is a node plugin that extends Y.Twipsy, and provides the ability to create popovers for content. Click for a popover demo.

Fork from Github

What features are supported?

Currently Y.Twipsy tooltip supports the following:

• Placement of tooltip above, below, left or right of content
• Offset support (how far the tooltip should be from the content (broken)
• Ability to set placement and tooltip content through data-attributes on DOM elemnts
• Customizable triggers (events that should show or hide the tooltip)
• Animation (no customization yet)
• The cool "tip" that points to the content
• Totally skinnable

YTwipsy is built as a Y.Node plugin and it's goal is to be as lightweight as possible.

What about the popover?

Y.Popover extends Y.Twipsy and has the feature set of Y.Twipsy. In addition it currently supports passing in a title. Additional features are planned. Let me know if you have any ideas on Github.

See it in action

Hover over the links below to see Twipsy in action.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur aliquet mollis turpis non tempus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Class aptent taciti sociosqu ad hover to show tooltip per conubia nostra, per inceptos himenaeos. Nunc posuere eros non orci auctor non faucibus nunc feugiat. Etiam tellus erat, bibendum non rutrum nec, commodo at tellus. Etiam feugiat risus vitae leo tincidunt ac venenatis purus vulputate. Donec at nisl ut nunc euismod varius. hover id lorem erat. Ut eget nunc nulla. Curabitur mollis, purus eu sodales luctus, metus sem sagittis justo, fringilla malesuada augue nunc sed quam. Curabitur ac magna eu sapien convallis tristique.