Version: 1.2.1
Description:
FancyTooltips is a WordPress Plugin and General Script that dynamically changes the tooltips that are created by browsers. Basically, FancyTooltips replaces those boring little boxes that appear next to your mouse with a dynamic and impressive one. FancyTooltips supports the title attribute from anchors (<a>), acronyms (<acronym>), inserts (<ins>), and deletions (<del>) and the alt attribute from images (<img />). It will also display the accesskey attribute from an anchor (<a>).
Download: Wordpress Plugin or Regular Script
How To Install:
For WordPress powered sites:
- Download the FancyTooltips WordPress Plugin.
- Extract the files.
- Upload the files to the /wp-content/plugins/ directory (do not alter the structure).
- Go into your WordPress Administration, and activate the FancyTooltips Plugin.
Note: FancyTooltips is available for one-click install using wp-plugin-mgr.
For other sites:
- Download the Regular Script file.
- Extract the files.
- Upload them to where the index of your website is located (do not alter the structure)
- Here’s the tricky part: Add the following to code in between your
<head></head>tags:<script language="javascript" type="text/javascript" src="./fancytooltips/fancytooltips.js"></script>
<link rel="stylesheet" href="./fancytooltips/fancytooltips.css" type="text/css" media="screen" />Note: You will need to edit the URI of the files if you alter the structure or if you want the FancyTooltips to display on a page that is located in a subdirectory.
Usage:
It’s simple to use. Once installed, all you need to do is add: title="This is the content of the FancyTooltips" attribute to anchors (<a>), acronyms (<acronym>), inserts (<ins>), and deletions (<del>) or the alt="This is the content of the FancyTooltips" attribute to images (<img />) (image FancyTooltips are turned off by default). It will also display access keys within the FancyTooltips, simple enter in the accesskey="a" attribute into an anchor (<a>).
Explanation:
There isn’t much to explain. Everytime you have a title (or, in <img />, an alt) attribute in your code, the script will replace them with the FancyTooltips! There isn’t much more than that.
Customization:
You can customize the colours of the FancyTooltips by editing the “fancytooltips.css” file. For those of you who aren’t CSS savvy, I suggest W3Schools.
You can turn on the <img /> recognition feature by remove /* */ from the fancytooltips.js file on line 399. Note: Remove /* */ from the first line, not the second.
By default, FancyTooltips are created throughout the entire webpage. If you wish to have FancyTooltips restricted to a certain ID container (e.g. <div id="content">) simply add the specified ID in between ” on line 27.
Change Log:
v.1.2.1 - Fixed:
- BIG CSS BUG. Caused FancyTooltip not to appear when hovering a link.
- Error with Plugin file (WordPress only).
- Above code snipet for other sites was incorrectly keyed. Caused the CSS not to link to any pages. Thanks Yamada.
v.1.2 - Added:
- No-edit install (WordPress only).
- One-click install (WordPress only).
- ID restriction.
- Help cursors for <abbr>, <acronym>, <del>, and <ins>.
v.1.2 - Removed:
- <img> FancyTooltips turned off by default.
v.1.2 - Improved:
- CSS semi-descriptions.
- Simplification of header include (WordPress only).
v1.1 (Beta Release) - Removed:
- Single file package.
v.1.0 (Private Alpha) - No Information
Licence:
As originally released by Stuart Langridge, this script is licensed under the MIT License.
Special Thanks:
This script was based on Nice Titles by Dunstan Orchard and Stuart Langridge.
Also, a big thank you to Brett Taylor for his help with the WordPress Plugin implementation. And Chris Beaven for the ID restriction code.