Javascript-CSS Tooltip

A custom tooltip which uses vanilla javascript and CSS3. It is tested in IE11+, Firefox 50+, Chrome 50+ and Safari 10+.

The tooltip also take into account if it has enough space on the right or left side of the viewport. If not, it shows the tooltip on the left or right of the element.

You can download the code from github.

Example

Hover me ipsum dolor sit, consectetur adipisicing elit. Aliquam, illo ut impedit! Quisquam fuga quo est? Nam alias, aliquam suscipit, atque, adipisci necessitatibus sunt dolore non iste debitis laboriosam Tooltip with a long description.

tooltip tooltip
Tooltip in an overflow:hidden container

Hover me ipsum dolor sit, consectetur adipisicing elit. Aliquam, illo ut impedit! Quisquam fuga quo est? Nam alias, aliquam suscipit, atque, adipisci necessitatibus sunt dolore non iste debitis laboriosam.

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas, veniam ipsa culpa vero suscipit consequuntur eligendi deleniti ducimus architecto commodi quod, est amet, laborum nisi asperiores debitis, pariatur excepturi quae. Tooltip with a long description.

tooltip tooltip
Tooltip in an overflow:hidden container