Best jQuery Tooltip Plugins & Tutorials with Demo

    jQuery Interactive Image Plugin

    jQuery Interactive Image Plugin

    A jQuery plugin to embed interactive images on your website.

    Features:

    • Insert interactive texts and images over large pictures
    • Flexible configuration
    • Easily customizable with CSS
    • Fully tested with CasperJS
    • Installable via package managers

    FLY : jQuery Popover & Tooltip plugin

    FLY : jQuery Popover & Tooltip plugin

    FLY is an extensible jQuery dropdown/popover/tooltip plugin.

    Html5tooltips.js : Tooltips with smooth 3D animation

    Html5tooltips.js : Tooltips with smooth 3D animation

    Tooltips  written in pure JavaScript, with smooth 3D animation implemented in CSS. No framework dependencies.

    Protip : jQuery Tooltip plugin

    Protip : jQuery Tooltip plugin

    A new generation jQuery Tooltip plugin.

    Features:

    • 49 position
    • Live refresh of tooltip options.
    • Gravity: find a better position if it won’t fit to the screen.
    • Placements: outside, inside, border, center
    • Custom HTML content
    • Icon support
    • Skins, sizes, schemes
    • Animations support
    • Custom event callbacks

    Hint.css : A tooltip library in CSS

    Hint.css : A tooltip library in CSS

    Hint.css is written as a pure CSS resource using which you can create cool tooltips for your web app. It does not rely on JavaScript and rather uses data-* attribute, pseudo elements, content property and CSS3 transitions to create the tooltips.

    offscreen.js : Detects if an Element falls of the Viewport

    offscreen.js : Detects if an Element falls of the Viewport

    jQuery plugin to detects if an element (tooltip) falls of the right/left/top/bottom side of your screen/viewport.Adds a class to all your elements with the defined selector that fall of the right/left/top/bottom side of the screen.

    GGpopover.js : A jQuery Popover plugin

    GGpopover.js : A jQuery Popover plugin

    ggpopover.js – It’s a simple jQuery popover plugin extended from Twitter Bootstrap’s popover plugin that supports 4 positions, title background color, title font color, title border color, content background color, content text color, arrow color without using images.

    • 4 Positions: top, right, bottom and left.
    • Unlimited title background colors.
    • Unlimited title font colors.
    • Unlimited content background colors.
    • Unlimited content text colors.

    Mousetip : jQuery Cursor Tooltips

    Mousetip : jQuery Cursor Tooltips

    Lightweight jQuery extension for creating cursor tooltips that follow mouse movement and position.

    Simptip : CSS tooltip made with Sass

    Simptip : CSS tooltip made with Sass

    A simple CSS tooltip made with Sass. You can have a tooltip in different directions ( top , left , bottom , right ). You can also have a Tooltip in different color such as success , info , warning and danger. And finally other features like ( soft edge , half arrow , movable effect , fade effect , multiline tooltip ).

    Video Lightning : jQuery Lightbox or Popover for Youtube & Vimeo videos

    Video Lightning : jQuery Lightbox or Popover for Youtube & Vimeo videos

    Turn any element into a lightbox or popover link for Youtube and Vimeo videos.Includes access to all embed API options for both providers as well as a healthy set of style options. Popovers are intelligently positioned and allow users to preview videos on hover.

    Features:

    • Simple access to all embed API options for both providers
    • Lots of options to customize and beautify your lightboxes
    • Intelligent popover auto positioning gravitates to page center
    • Preview videos on hover, pin if you want them to stick around
    • Lazy loading of videos prevents slow page load due to video embeds
    • Rick Roll with ease (don’t pass video id, add rick_roll option to prevent closing)