An open API service indexing awesome lists of open source software.

https://github.com/knadh/tinytooltip

An extremely tiny tooltip plugin for jQuery
https://github.com/knadh/tinytooltip

Last synced: about 1 year ago
JSON representation

An extremely tiny tooltip plugin for jQuery

Awesome Lists containing this project

README

          

# tinytooltip
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

## Example

### HTML - Setup


<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>

### Usage


// == 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')

## Options



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