Tooltipsy is an ultra simple jQuery tool tip plugin I had ever seen. The plugin is designed in a way to easily control the CSS, which I think is quite difficult with other tool tip plugin that I have seen. To be frank, I was impressed with @briancray work in making Tooltipsy with great control over CSS in such a easy way. In addition to that, users can add nice animations to the tooltip without bricking your head to make it work.
So, if your planning to use a tooltip for your blog or a website, I do recommend everyone to give a try for Tooltipsy.
How it works
Step 1: Download Tooltipsy and upload it to your own server. After download link the path of the Tooltipsy inside the script and include it in your HTML or whatever you use.
<script type="text/javascript" src="/js/tooltipsy.min.js"></script>
Step 2:
Add the CSS to brush up the tooltip design. You can change it to different shapes and colors upon your interest and place it in the main stylesheet
.tooltipsy
{
padding: 10px;
max-width: 200px;
color: #303030;
background-color: #f5f5b5;
border: 1px solid #deca7e;
}
Step 3: Now finally add the title attribute to let it work
<a class="hastip" title="Show me">
<a class="hastip" title="Me too">
<script type="text/javascript">
$('.hastip').tooltipsy();
</script>
Isn’t this easy to add a tooltip? Yes, it is.
If you want some more, check out their reference library.
