Template:Sandbox/Aurelain/Hint

A minor tooltip for short descriptions. As opposed to the "title" attribute, it has the following advantages:

• It's instant upon hover (has no delay)
• It uses a skin customized for Olden Era
• Wraps the text if too long
• Can be placed top/left/right/bottom. Defaults to "top".

Usage

1. Basic:

Input: {{Sandbox/Aurelain/Hint | Hello | World}}

Output: Hello <span class="wiki-hint-floating" style="" World

---

2. With images. In such cases, the subtle underline is automatically removed.

Input: {{Sandbox/Aurelain/Hint | [[File:Icon_Resource_Wood.png]] | Wood}}

Output: <span class="wiki-hint-floating" style="" Wood

---

3. With a lot of text

Input: {{Sandbox/Aurelain/Hint | Lorem | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.}}

Output: Lorem <span class="wiki-hint-floating" style="" Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

---

4. Placed at the bottom:

Input: {{Sandbox/Aurelain/Hint | Hello | World | side=bottom}}

Output: Hello <span class="wiki-hint-floating" style="" World

---

5. Placed to the left:

Input: {{Sandbox/Aurelain/Hint | Hello | World | side=left}}

Output: Hello <span class="wiki-hint-floating" style="" World

---

6. Placed to the right:

Input: {{Sandbox/Aurelain/Hint | Hello | World | side=right}}

Output: Hello <span class="wiki-hint-floating" style="" World

---

7. With a custom style:

Input: {{Sandbox/Aurelain/Hint | Hello | World | style=max-width:none;width:300px}}

Output: Hello <span class="wiki-hint-floating" style="max-width:none;width:300px" World