Tooltips are becoming an important part of web design nowadays. Tooltips are nothing but a small popups with useful information which appear on mouse hover on certain elements, these elements may be links, images or text. Tooltips helps the web design more enriching and space on the web layout is saved to some extent.
Tooltips can be generated using jQuery, JavaScript, CSS or other JavaScript frameworks. Today, we will see some of the beautiful jQuery tooltip plugins from around the web to inspire us.
The jQuery tooltip is one of the best building blocks one should consider utilizing within their web design and development. Tooltips offer extra functionality and versatility, and can be regarded as one of the most important user-interface components for most websites.
1. Best Free Jquery Tooltip Plugins – Tooltipster
Tooltipster is a powerful, flexible jQuery plugin enabling you to easily create semantic, modern tooltips enhanced with the power of CSS. Tooltipster allows you to use any HTML tag you can think of inside your tooltips. This means you can insert things like images and text formatting tags.
==============================================
2. Best Free Jquery Tooltip Plugins -Toolbar.js
Toolbar.js allows you to quickly create tooltip style toolbars for use in web applications and websites. The toolbar is easily customisable using the twitter bootstrap icons and provides flexability around the toolbars display and number of icons.
Toolbars can be attached to any element required. You can run as many toolbars as required. Toolbars are responsive and follow the element on resize. The implementation is pretty straightforward with simple options. It is released under MIT License.
==============================================
3. Best Free Jquery Tooltip Plugins - Grumble js
Grumble.js provides special tooltips without the usual limitations of north/east/south/west positioning. A grumble can be rotated around a given element at any angle, all 360 degrees. Any distance can be specified.
Any CSS style can be applied. There’s auto-magic size adjustment for use with localised text. FX queues for animating multiple grumbles. And it works in IE6+, and modern browsers. Image spriting is used for actual bubble image, you can change this as you want – it’s just CSS.
==============================================
4. Best Free Jquery Tooltip Plugins - Progression.js
Progression.js is a jQuery plugin that shows tips about an active form field and also displays the progress (how much of the form is filled). It uses the data attributes for storing the tips, has options for customizing the tooltip and can be implemented into any form so easily.
==============================================
5. Best Free Jquery Tooltip Plugins - Opentip
Opentip is a pretty cool JavaScript tooltips framework that can work with jQuery, Prototype or standalone.
It creates the tooltips with HTML5 canvas so that any creative designs are possible and they are rendered almost equally in all browsers. There is support for calling content into tooltips with Ajax, positioning them wherever wanted or grouping them (so that only one tooltip of the same group can stay open).
A nice and unique feature is stems (the little pointers) which auto-arranges themselves into any direction.
==============================================
6. Best Free Jquery Tooltip Plugins - iPicture
iPicture, a jQuery plugin, is perfect for such cases and allows us to place tooltips over any desired location of images. Once the user hovers/clicks the pointers, the tooltip is displayed with its pre-defined content. There are several options for customizing the functionality including the ability to use different pointer images for each tooltip or their animation types.
Also, iPicture has a handy initialize function that saves so much time by enabling a configuration wizard where we can place pointers + set their definitions with drag ‘n’ drops and the JSON output to be used in the code is created automatically.
==============================================
7. Best Free Jquery Tooltip Plugins - Joyride
Joyride is a plugin for jQuery that simplifies the process of guiding users to discover the features of a website. By defining the steps of the tour as an ordered list, the plugin displays desired information near any HTML element inside tooltips. The location of tooltips (bottom, top), scrolling speed of the page, cookie on/off and several other options exist for customization. To sum up, Joyride is a simple yet effective way of helping users find out the features of a website.
==============================================
8. Best Free Jquery Tooltip Plugins - TipTip
TinyTips is a very lightweight jQuery plugin that gives the ability to add tooltips to pretty much any element on a page. Thoroughly documented and designer friendly. TinyTips is very easy to install and use. Simply include TinyTips and the latest release of jQuery in the head. You can also give it a nice style by editing the stylesheet.
==============================================
9. Best Free Jquery Tooltip Plugins - qTip 2
qTip2 is the second generation of the advanced qTip plugin for the ever popular jQuery framework. Building on 1.0′s user friendly, yet feature rich base, qTip2 provides you with tonnes of features like speech bubble tips and imagemap support, and best of all… it’s completely free under the MIT/GPLv2 licenses.
qTip2 utilises a separate stylesheet to contain all tooltip styles, which allows you to easily add new styles without additional JavaScript code, as well as easily editing pre-existing styles.
==============================================
10. Best Free Jquery Tooltip Plugins - Tooltipsy
Tooltipsy is a jQuery plugin that provides a flexible base for creating tooltips. It comes with minimum default styles or animations but gives you the complete control over them. It can be positioned however you wish, look and feel can be totally customized with CSS and any type of animations can be implemented.
Download Demo
==============================================
10 BEST FREE JQUERY TOOLTIP PLUGINS 2014
I just released my tooltip plugin called tipso. You can have a look at it here http://tipso.object505.com/
ReplyDelete