Add a tooltip to a div

Question

I have a div tag like this:

<div>   <label>Name</label>   <input type="text"/> </div> 

How can I displaying a tooltip on :hover of the div, preferably with a fade in/out effect.

Answer 1

For the basic tooltip, you want:

<div title="This is my tooltip"> 

like:

.visible {   height: 3em;   width: 10em;   background: yellow; }

<div title="This is my tooltip" class="visible"></div>

For a fancier javascript version, you can look into:

https://jqueryhouse.com/best-jquery-tooltip-plugins/

The above link gives you 25 options for tooltips.