Accessible Tooltip 1.3

This class provides accessible tooltip with various effects and possibilites.

Widget based on Ascribe Dialog



Details

Author
3i1a4o
Current version
1.3
GitHub
mashalla/tooltip
Downloads
9484
Category
Widgets
Tags
Report
GitHub Issues

Releases


Dependencies

  • _self_/_current_:
    • core/1.3: '*'
    • more/1.2.4: Fx.Elements
    • Core/MooTools

How to use

Individual tool tips

var tooltip = new AscTip($('id_of_element_to_target'), 'Text of tooltip goes here');

By default, the tooltips will use a CSS class called "AscPop". But you can customize the class or use multiple styles of tooltips on the same page. To use a CSS class called "YourPop", use the classPrefix option when instantiated the AscTip class.

var tooltipiwthyourcss = new AscTip($('id_of_element_to_target'), 'Text of tooltip goes here', 'n', {classPrefix: 'Your'});

To add multiple tooltips at a time, use the AscTips class.

var asc_tooltips = new AscTips([
    { id:"id_of_element_to_target", msg:"Tooltip message", align:'nw },
    { id:"id_of_element_to_target", msg:"Tooltip message", align:'nw },
    { id:"id_of_element_to_target", msg:"Tooltip message", align:'nw }
]); 

To customize how you wish the tooltip to be aligned to the target element use the following values:

When the tooltip is to align itself outside the target:

nw - northwest
n - north
ne - northeast
en - east north
e - east
es - east south
se - south east
s - south
sw - southwest
ws - westsouth
w  -west
wn - west north

If the tooltip is to position itself within a target:

nw - northwest
n - north
ne - northeast
e - east
se - south east
s - south
sw - southwest
w  -west

Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.

blog comments powered by Disqus