Tooltips on website are small things which can play a big role in website design. If a tooltip on your website is very well made and looks amazing, then it can lift up visitors impression about your website. And that’s why here comes jQuery to help with its well made tooltips. And remember that all those small website design things make your website look better.
So this time I will show you my Top 30 of jQuery tooltip plugins. Enjoy!
This article has been updated on May 29, 2012
1. The Tooltip
The Tooltip is a good looking tooltip that appears when you mouseover a tooltip handle. It’s not a jQuery plugin, but CSS3 code, nevertheless, it has cool animation. It is very handy too. View preview video on the site to see how powerful it is!
- CSS3 fade in and fade out gives The Tooltip a smooth appearance (works in modern Webkit browsers, Firefox 4.0, Opera 11)
- Gracefully degrades in older browsers
- 25 awesome color schemes included
- Good documentation and examples (as seen in the video preview) are present
- You can use The Tooltip as a regular speech bubble too
Very cool tooltip! It’s very well made because it consists of cool transition effects and it also has a transparency and a drop shadow effect.
Brilliant tooltip! It looks so simple but it has awesome transition effects. This tooltip could be very useful for clean and simple websites.
Beautifully made tooltip! This tooltip never disappears but follows when you hover over other links. Such a simple looking tooltip but its animation is brilliant.
Very nice tooltip with cool transition effects and it also has a drop shadow.
Precisely designed and coded Fresh Tooltips. Great for any kind of website, and very practical. The one on the top is 100% transparent black, which looks very, very cool. Also, perfect for learning—I’ve made lots of cross-browser research before I’ve done these, you won’t find better tutorial with such an amazing design than personally going through my code.
Cool tooltip with nice transition effects and cool transparent border around it.
Beautifully made tooltip with fade in / out transition effects, transparency and drop shadow effects.
Beautifully made tooltip with nice transition for input fields.
Simple but well made tooltip with a fade in transition effect. It has a cool looking border around it and when this tooltip appears, it also follows your mouse.
Cool tooltip which appears when you click on the link and then it sticks on the right-top corner of your window, and disappears after some time or when you close it manually by clicking on the close button. It also has fade in / out transition effects.
I know the main focus of this collection is for Tooltips but I just can’t let this gem pass without you knowing about it. It has tooltips too, and most of all you have the freedom to customize it at your own liking!
Interesting tooltip which can handle image and text together like a mini page. It has a drop shadow effect.
Cool Digg-style post sharing tool. This tooltip could be very useful for social networking website.
Interesting tooltip with rounded corners for input fields. Tooltip fades in when you click on the input field and fades out when you click somewhere else.
Beautifully made tooltip with fade transitions. When you hover over a link, a tooltip fades in just above or below the link.
Very simple but good looking tooltip. This tooltip is available with rounded corners and also as a speech bubble tip.
Interesting tooltip plugin, where you can set manually where your tooltip will show up.
Cool tooltip with nice transition effects.
Interesting and good looking tooltip which appears above, below, on the right or left side of the link.
Simple tooltip but it could be useful to display an image when you hover over a link.
Various simple tooltips with fade in and fade out transition effects and border around them.
19.1. Shiny Tooltips
Have you seen a tooltip that makes an item…shine? Blind your visitors with magnificence!
Very simple tooltip with border around it, which follows your mouse.
Nice balloon style tooltip with transparency effect. There are available various tooltip styles, even interesting tooltips with cool animation, so you can choose one that fits best for your needs.
Various tooltip plugins for your website. Here you can find a simple tooltip with a nice fade transition and also you can find a good looking bubble style tooltip.
Simple tooltip which shows up when you hover over a link and stays until you close it.
Few simple but different tooltips.
The tooltip which appears on the right side of the link.
This is simple but useful tooltip for login form.
Simple tooltip with Ajax-loaded content. It has fade in and fade out transition effects.
Simple tooltip which shows up when you click on the arrow button and disappears when you click somewhere else.
Simple tooltip with rounded corners. It follows your mouse movements.
Peteris Kelle is 21 year old web designer. He has knowledge in various programs, such as Maya 3D, Flash, Photoshop, After Effects, Illustrator, etc. and also in various programming languages, such as Pascal, C, C++, Delphi, C++ Builder. He dedicates his free time to hobbies such as martial arts, mountain biking, snowboarding, playing Airsoft. Peter's aim is to start his own business. You can check Peter's works on his website. You can find him on Twitter or Myspace.