Get started with tooltipster CDN

MIT licensed

Tooltipster is a lightweight and customizable library for creating dynamic tooltips in the web.

Tags:
  • tooltip
  • jquery

Stable version

Copied!

How to start using tooltipster CDN


<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/tooltipster.bundle.min.css">
    <script src="https://cdn.cdnhub.io/tooltipster/4.2.8/js/tooltipster.bundle.min.js"></script>
    <style>
        .tooltip-custom {
            background-color: #333;
            color: #fff;
            border: none;
            padding: 8px;
            border-radius: 6px;
        }
    </style>
</head>
<body>
    <button id="tooltip-target">Tooltip on hover</button>
    <span id="custom-content" class="hidden">This is a custom tooltip</span>

    <script>
        tooltipster.init(document.querySelector('#tooltip-target'), {
            content: document.querySelector('#custom-content'),
            interactive: true,
            trigger: 'hover',
            theme: 'tooltipster-dark'
        });
    </script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!

All versions