Minimal Rich Text Tooltip JavaScript Library – Creativa Tooltip

Category: Javascript , Tooltip | August 17, 2021
Views Total:196 views
Official Page:Go to website
Last Update:August 17, 2021


Minimal Rich Text Tooltip JavaScript Library – Creativa Tooltip


A lightweight, fully configurable, mobile-compatible, rich text tooltip JavaScript library.

How to use it:

1. Download and import the creativa-tooltip.js library into the document.

<script src="./creativa-tooltip.js" type="text/javascript"></script>

2. Define the tooltip content in the ct-tooltip attribute:

<a href="" ct-tooltip="Go to CSSScript<br><i>Test HTML</i>">

3. That’s it. You can config the position of the tooltip using the ct-tooltip-position attribute:

  • top (default)
  • right
  • bottom
  • left
<a href="" 
   ct-tooltip="Go to CSSScript<br><i>Test HTML</i>"

4. Customize the tooltip by overriding the default parameters in the creativa-tooltip.js.

static settings = {
  animationSpeed: 100,
  openAnimationDelay: 150,
  borderRadius: '5px',
  backgroundColor: '#000',
  color: '#fff',
  fontSize: '12px',
  fontWeight: 500,
  lineHeight: '16px'

You Might Be Interested In:

Leave a Reply