Template:Tooltip/doc

The template Tooltip is used to write an abbreviation with its meaning. It is a wrapper for the HTML element , the element used by most web browsers to create a tooltip indicating the meaning of an abbreviation or acronym.

See for how to implement similar functionality without abusing markup (though it is also not accessibility-perfect  input sought at Template talk:Hover title).

Usage
The template takes two unnamed parameters, in order: These can also be given as explicitly numbered parameters; this is necessary if a parameter's content contains the equals (=) character:
 * : abbreviation – the abbreviation, acronym, or initialism to be explained; shows as text, and may use wikimarkup, such as a link to an article about what it refers to.
 * : meaning – the expansion or definition of the abbreviation; shows as the popup when you hover over the abbreviation . can be used in this parameter.
 * Complex example:
 * Produces: $E = mc^{2}$

A third unnamed parameter accepts the following values (which have the same effect):
 * : IPA or i – applies the template to fix the International Phonetic Alphabet rendering on Windows XP.

Named parameters and the input they take:
 * : One or more CSS classes (space-separated if more than one)
 * : An HTML id (i.e., a  link anchor); this must be unique on the entire page
 * : Arbitrary inline CSS to apply to the abbreviation text. For any input that needs to be quotation-marked (e.g. because it contains a space character), use straight single-quotes only, e.g. font-family: 'Times New Roman', serif;

Examples
When hovering over the text "MSLP", something like will appear as a tooltip in most browsers. Popular screen readers, used by visually impaired readers, give the meaning in a different way.

Linking must be done a particular way
To wiki-link the abbreviation being marked up by this template, wrap the template in the link, not vice-versa, or the meaning will not appear in some browsers, including Chrome.

Do not link, or use any other wikimarkup or HTML markup, in the meaning (popup) – only plain text.

The mouse-over popup for the meaning text is created by a  attribute inside an  HTML element's opening tag, so it cannot itself contain any HTML (or markup that resolves to HTML when rendered). This includes simple things like.

Accessibility and HTML validity concerns
This template is intended for use with abbreviations (including acronyms and initialisms).

The Web Content Accessibility Guidelines contain guidelines for using the element generated by this template; see section H28: Providing definitions for abbreviations by using the abbr and acronym elements.

Furthermore, the HTML specifications (both those of the W3C and WHATWG) strictly define the element as reserved for markup of abbreviations. Abusing it for mouse-over tooltips breaks our semantic markup and makes our content (technically, "not well-formed"; it will pass an basic automated validator test because such a tool can't tell that the logical application of the data to the structure isn't correct, only that tags are nested properly, etc.).

Redirects
The following template names will redirect to abbr:
 * Abbrv
 * Define
 * Tooltip (deprecated)

Template data
 {       "description": "This template defines an abbreviation or acronym, by creating a tooltip that is displayed on mouse-over.", "params": { "1": {                       "label": "Abbreviation", "description": "Shows as text", "type": "string/line", "required": true },               "2": {                        "label": "Meaning", "description": "Shows as a tooltip", "type": "string", "required": true },               "IPA": { "label": "IPA", "description": "Applies to fix strings in the International Phonetic Alphabet rendered in Internet Explorer on Windows XP", "type": "string/line", "required": false },               "class": { "label": "Class", "description": "Adds a HTML class", "type": "string/line", "required": false },               "id": { "label": "ID", "description": "Adds a HTML id", "type": "string/line", "required": false }       } } 