Rich Text Tooltip Plugin For jQuery - bubbleBox
File Size: | 7.88 KB |
---|---|
Views Total: | 412 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

bubbleBox is a lightweight and customizable jQuery tooltip plugin for creating a rich text popup box that can be attached to any DOM element within the document.
How to use it:
1. Download and load the bubbleBox.min.js
script after jQuery.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/bubbleBox.min.js"></script>
2. Insert your tooltip content to the target element.
<div class="myContainer"> The Tooltip Will Be Attached To This Container <div class="tip"> Tooltip Content Here </div> </div>
3. Initialize the plugin to enable the tooltip.
$(function () { addBubbleAll('.myContainer', '.tip', { // apply the tooltip to multiple elements }) // or addBubble('.myContainer', '.tip', { // apply the tooltip to a single element }) })
4. There are a few options that you can pass through to customize your tooltip further.
addBubbleAll('.myContainer', '.tip', { // 'top', 'bottom' // 'left', 'right' direction: 'right', // offset in px offsetX: 10, offsetY: 0, // animation options fadeInDelay: 300, fadeOutDelay: 0, fadeInTime: 100, fadeOutTime: 0, })
This awesome jQuery plugin is developed by AiCorein. For more Advanced Usages, please check the demo page or visit the official website.