JQuery plugin Tooltipster implements beautiful tooltip, jquerytooltipster

JQuery plugin Tooltipster implements beautiful tooltip, jquerytooltipster

Tooltipster is a lightweight jQuery tooltip plug-in that can help you quickly generate beautiful tooltip.

1. Load jQuery and plug-in files including Tooltipster

Download tooltipsterand move tooltipster.css and jquery. tooltipster. min. js to the root CSS and JavaScript directory. Next, load jQuery and the CSS and JavaScript files including Tooltipster in your tag:

2. Set your HTML
To work with Tooltipster, we first need to add any elements of the. tooltip class (or any category/selection means you want to use), and we want a tooltip. Next, we will set the title attributes, regardless of what we want to say. The following are some examples:
Add a tooltip image:
Copy codeThe Code is as follows:


When you add a tooltip, a link to the class already exists:
Copy codeThe Code is as follows:
<A href = "http://calebjacob.com" class = "ketchup tooltip" title = "This is my link's tooltip message! "> Link </a>

When a tool is added, a div is prompted:
Copy codeThe Code is as follows:
<Div class = "tooltip" title = "This is my div's tooltip message! ">
This div has a tooltip when you hover over it!
</Div>

3. Activate Tooltipster.

The last thing we need to do is to activate the plug-in. To do this, add the following script label before you finish 
Summary:

1. The tooltip supports HTML Tag content.
2. lightweight
3. flexible and efficient
4. Simple Style definition, 100% CSS
5. Three themes are supported.
6. Support for firefox, Chrome, IE7/8/9, Opera, and Safari
The above is all the content of this article. I hope you will like it.