Hint.CSS is a tooltip library written in SASS which uses only HTML/CSS to create simple tooltips.

It does not rely on any JavaScript and rather uses data-* attribute, pseudo elements, content property and CSS3 transitions to create the tooltips. Also it uses BEM naming convention particularly for the modifiers.

Tooltipster is a lightweight (4,813 bytes minified) jQuery plugin that enables you to easily create clean, HTML5 validated tooltips.

• Supports HTML tags inside the tooltip
• Lightweight and degradable
• Extremely flexible & fast to set up
• Easily styled with 100% CSS – no images needed
• Plays nicely with IE

Piecon is a tiny javascript library for dynamically generating progress pie charts in your favicons. It dynamically draws and updates a pie chart in the favicon’s place, very useful if you want to show a simple percentage loader in the favicon.

Works perfectly in Chrome, Opera and Firefox, while in IE and Safari it defaults to a simple page title update.

Piecon was inspired by Tinycon – It allows the addition of alert bubbles and changing the favicon image.

The Annotator is an open-source JavaScript library and tool that can be added to any webpage to make it annotatable.

Annotations can have comments, tags, users and more. Morever, the Annotator is designed for easy extensibility so its a cinch to add a new feature or behaviour.

The Annotator JS also has a simple but powerful plugin architecture. While the core annotator code does the bare minimum, it is easily extended with plugins that perform such tasks as: serialization, authentication and authorization, prettification etc…

You’ll need to store your annotations data somewhere, but if you can’t then luckily there is an easy way to do this, using AnnotateIt, a hosted web service for storing annotations.

Messi is a lightweight jQuery notification plugin to show clean, elegant messages in a simple way. Stop using default JavaScript alert notifications and provide extended information to the user with a beautiful eye-catching notifications.

Messi is very easy to use and requires jQuery to work, you can display text, html content, images and ajax requests.

Tooltip is a splendid invention. Small detail in web design that plays a big role when it comes to user experience. Usually, tooltips are used to present a tiny amount of hidden content (mainly explanatory, so-called tips), that pops up when user moves a cursor over or clicks (less common) on a special target.

Major Features

• Responsive: It relies on a maximum width value when viewed on large screens, adopts to narrow environments and picks the best viewable position relatively to the target (top, bottom; left, center, right)
• Mobile Friendly: It pops up when a call-to-action button is tapped and disappears when tapped on the tooltip itself
• Cross Browser Compatible: Works in all modern browsers and degrades well for older ones

Sweet Tooltip is a jQuery & CSS3-based tooltip, not merely a one-style tooltip but seven. This imageless CSS tooltips are crafted using CSS power, linear-gradient, box-shadow, text-shadow, :after and :before selector, etc.

This jQuery CSS3 tooltip is created with aim for having a style-independent tooltip. There are seven styles currently available in this package : Sweet Strong, Mini Slick, Big Grey, Nightly, Shiny Red, Soft Blue and Big Yellow.

noty is a jQuery plugin that makes it easy to create alert, success, error and confirmation messages as an alternative the standard alert dialog. Each notification is added to a queue.

The notifications can be positioned at the top, bottom, centre, top left or top right. There are lots of other options in the API to customise the text, animation, speed, buttons and much more.

It also has various callbacks for the buttons, opening closing the notifications and queue control.

Recommended: Designing User Friendly Websites and Applications with Notify!

Tinycon is a small library for manipulating the favicon, in particular adding alert bubbles and changing images.

Tinycon gracefully falls back to a number in title approach for browsers that don’t support canvas or dynamic favicons.

Alert bubble in the favicon allows users to pin a tab and easily see if their attention is needed.

jsMessage is a JavaScript library for creating custom notifications, alerts and confirmations. This library was extracted from code of DHTMLX suite.

jsMessage is only 3kb gzipped, without external dependencies and offers offers 3 variations at your disposal: alerts, confirmation boxes and custom notifications.