25 Useful jQuery Tooltip Plugins and Tutorials

September 16, 2009 - 33 CommentsWritten by Paul Andrew

Categories → Ajax,Javascript,Tutorial,Web Design

If you are looking to give your readers the option of a little bit more information or optional extra navigation, a great solution is to use Tooltips. Tooltips are a “common graphical user interface element, that are used in conjunction with a cursor, usually a mouse pointer. The user hovers the cursor over an item, without clicking it, and a small box appears with extra information regarding the item being hovered over” (via Wikipedia). To give your tooltip extra functionality and vesatilty the best and simplest solution is using Javascript, especially jQuery.
In this post we have collected 25 of the best jQuery Tooltip Plugins and Tutorials to help with your next project.

jQuery Tooltip Plugins

jQuery Tooltip Tutorials

Create a Digg-Style Post Sharing Tool with jQuery

View Demo

Source

Create a jQuery Popup Bubble

View Demo

Source

jQuery Horizontal Tooltips Menu Tutorial

View Demo

Source

Build a Better Tooltip with jQuery Awesomeness

View Demo

Source

Creating A Simple Tooltip Using jQuery and CSS

View Demo

Source

Create a Simple CSS + Javascript Tooltip with jQuery

View Demo

Source

You might also like…

20 jQuery Plugins and Tutorials to Enhance Forms »
30 Tutorials Combining Both WordPress and jQuery »
25 Fresh and New jQuery Plugins and Tutorials »
50 Useful Tools and Generators for Easy CSS Developmentc »
20+ Resources and Tutorials for Creative Forms using CSS » »
24 CSS (in some cases with jQuery) Navigation and Menu Tutorials » »
22 CSS Button Styling Tutorials and Techniques » »
15 Amazing jQuery Image Gallery/Slideshow Plugins and Tutorials » »

About the Author: Paul Andrew (830 Articles)

Paul Andrew is the editor and founder of Speckyboy Design Magazine. You can follow Speckyboy on Twitter, on Facebook, on Digg or you can subscribe via RSS.

Comments and Reactions

http://www.vividwebgraphics.com/ sean
Nice Collection.Good work
Pingback: 25 Useful jQuery Tooltip Plugins and Tutorials | TopRoundups
http://www.cooltricksntips.com Rahul Jadhav
Awesome collection!!! Will definitely use one of these
http://www.cancelbubble.com cancel bubble
Prototip 2 is based on Prototype not jQuery.
http://www.tutoriallounge.com Tutorial Lounge
really helping stuff for web developers and even for designers for get some help for make some latest modules in our web needs.
Pingback: links for 2009-09-17 « Giri’s Blogmarks
Rain
You’re my hero.I’m just looking for some jquery tooltip plugins.Thx your great article.
Pingback: Notable Tech Posts – 2009.09.20 | The Life of Lew Ayotte
http://www.webgrid.com WebGrid
Qtip was my choice. Nice developer and followup issues.
http://sitemile.com Andrei
something veru usefull. See more of this in action there made by me: http://www.sitemile.com/p/classifiedTheme
Pingback: 65+ Must See Resources Especially For Designers To Discover The Best Of The Web In September - Programming Blog
Pingback: 65+ Must See Resources Especially For Designers To Discover The Best Of The Web In September | Filme Gratis Filme Moca
Pingback: FreeDownloadSecrets.com » Blog Archive » 65+ Must See Resources Especially For Designers To Discover The Best Of The Web In September
Pingback: OmniDownloads | 65+ Must See Resources Especially For Designers To Discover The Best Of The Web In September
http://www.posh-creation.com Webdesign@Posh-Creation
wow these are really cool, thanks for sharing
Pingback: 65+ Must See Resources Especially For Designers To Discover The Best Of The Web In September « JinSpiration
http://www.profitplatformpro.com Andrew Anderson
Thanks for the list… definitely will keep me busy looking through them all. Good job!
Cheers,
Andrew Anderson
wessel
qtip was a little to large (38kb compressed). cluetip did not have enough position possibilities for me.
BeautyTips http://plugins.jquery.com/project/bt looked also nice, but quite big on IE, and lack some positioning
My choice was jQuery Tooltip from flowplayer.org. Worked great!
Pingback: 40 jQuery Plugins, Tutorials, Resources And Tools Of 2009 | Tweeaks Design
http://www.selog.in nitesh
Great list. Thanks for putting this together and spending your time on helping others.
GRomones
Thanks! Great tools.
I also suggest Likno’s Web Tooltips Builder.
Quite easy to use for making jquery html tooltips for sites.
You can check them out at:
http://www.likno.com/jquery-tooltips/index.php
Hope it helps.
Thanks
Greg
http://sqlgoogler.blogspot.com fadi
very cool plugins ^-^
http://www.rooobi.de Robert
Hi all,
Nice collection. But ‘Prototip’ and ‘Prototip 2′ wont work with jQuery! I tryed everything and the author confirmed it. jQuery noConflict wont work too. Try it without jQuery and you’ll be happy.
Regards
Alexander
The most beautiful one, Prototip, is based on Prototype :(
Salman
Really helpful. Thanks for gathering all the Jquery Tool Tip techniques.
Pingback: "Sprechblase bei hover?"
luckeno ozora
that’s great,, thanks for sharing ;)
http://www.buildvoy.com building services
very usefull collection in one place. thanks;)
http://www.ganeshbaniya.com GBaniya
I’m definitely going to try some of these and use it when re-designing my personal website.
Thanks a lot.
Gust
great bro very usefull collection in one place. thanks;
Pingback: jQuery 툴팁 플러그인 – 마우스 올리면 설명이 나오게 해 주는 플러그인
http://twitter.com/iitbakar IIT Bakar
Good Article :)
http://www.oldworldcreative.com Evan Skuthorpe
Great collection of tooltips, nice one!

25 Useful jQuery Tooltip Plugins and Tutorials

jQuery Tooltip Plugins

qTip – The jQuery Tooltip Plugin

BeautyTips, a jQuery Tooltip Plugin

jQuery Tooltip – Tooltips done right

Prototip 2 – Create Beautiful Tooltips with Ease

jGrowl

Simpletip – A simple jQuery Tooltip Plugin

jQuery plugin EZPZ Tooltip

Coda Popup Bubbles

jQuery Input Floating Hint Box

vTip

jHelperTip 1.0 – The Multi-Use Tooltip for jQuery

jTip – The Jquery Tool Tip

jQuery ClueTip Plugin

Tipsy – Facebook-Style Tooltip Plugin for jQuery

Pop! Simple Pop Menus with jQuery

jQuery Ajax Tooltip

Easy Tooltip – jQuery Plugin

Easiest Tooltip and Image Preview Using jQuery

jQuery (mb)Tooltip 1.6

jQuery Tooltip Tutorials

Create a Digg-Style Post Sharing Tool with jQuery

Create a jQuery Popup Bubble

jQuery Horizontal Tooltips Menu Tutorial

Build a Better Tooltip with jQuery Awesomeness

Creating A Simple Tooltip Using jQuery and CSS

Create a Simple CSS + Javascript Tooltip with jQuery

You might also like…

About the Author: Paul Andrew (830 Articles)

Comments and Reactions

Partners

Worthy Links

Pages

Subscribe & Follow

Sponsors