tinytooltip (900 bytes minified) is an extremely tiny, easy to use tooltip plugin for jQuery
Kailash Nadh, October 2011
License: MIT License
Documentation and Demo: http://kailashnadh.name/code/tinytooltip
<head> <script type="text/javascript" src="lib/jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="src/jquery.tinytooltip.css"/> <script type="text/javascript" src="src/jquery.tinytooltip.min.js"></script> </head>
// == hover tooltip with static text
$('.example').tinytooltip({message: "This is an example tooltip!"});
// == on click tool tip with dynamic text
$('.example').tinytooltip({
message: function(tip) {
return $(this).val();
},
hover: false
});
$('.example').click(function() {
$(this).trigger('showtooltip'); // show the tooltip
}).blur(function() {
$(this).trigger('hidetooltip'); // hide the tooltip
});
To show tooltips at will, set the 'hover' option to false while initializing the tooltip on an element. Then, to show the tooltip, use .trigger('showtooltip') and to hide, .trigger('hidetooltip')
| message | Tooltip message. Can be a string or a function() |
| hover |
true (default) or false Standard tooltip behaviour. Show tooltip on mouseover and hideon mouseout |
| classes | Addition classes (separated by space) to be added to the tooltip div |