From Joe

There are 3 components needed to use tooltips:

  • The required javascript
  • The required tooltip template
  • The source info to be displayed as a tooltip

Step 1

To get the required javascript on your wiki, just copy/paste this line of code to your wiki's MediaWiki:Common.js

importScriptPage('MediaWiki:Tooltip.js', 'joeplayground');

Step 2

Create a page titled Template:Tooltip and copy/paste the following:

<includeonly>[[{{{1|}}}|<span class="ajaxttlink">{{{2|{{{1|}}}}}}</span>]]</includeonly>

Step 3

Insert the tooltip information on its source page between the <div class="tooltip-content"> </div> tags. This information can be hidden (display:none), which is how the following example code is set up.

<div class="tooltip-content" style="border:1px solid #777; background:#000; padding:10px; width:200px; display:none">
Info line 1<br/>
Info line 2<br/>
<span style="color:gold">Gold info line</span><br/>
<span style="color:green">Green info line</span>

Step 4

Use the tooltip template to display the tooltip as well as create a link to the source page.