Example one:

Show the tooltip for all links with a title set.

JavaScript code:

	$('a[@title]').leviTip();

HTML markup:

	<a href="http://www.yahoo.com" title="Yahoo!">Link to Yahoo!</a><br />
	<a href="http://www.ask.com">No title...no tooltip!</a><br />
	<a href="http://www.jquery.com" title="A link to the "Write Less, Do More, JavaScript Library"">jQuery!</a>

Result:

Link to Yahoo!
No title...no tooltip!
jQuery!

Example two:

Show the tooltip when hovering over the image with the id #church.
Use the element with the id #churchtip as tooltip.
Do not add the default class to the tooltip!
Increase the delay before closing the tooltip a little bit.

JavaScript code:

	$('#church').leviTip({sourceType: 'element', source: '#churchtip', addClass: '', closeDelay: 500});

HTML markup:

	<img id="church" src="church.jpg" border="1" />
	<div id="churchtip"><div class="header">The header!</div>..and a little description..</div>

Result:

..and a little description..

Example three:

Show the tooltip when hovering over the image with the id #anotherchurch.
Use the element with the id #anotherchurchtip as tooltip and hide it on page load.
Add the class anotherchurch to the tooltip!

JavaScript code:

	$('#anotherchurch').leviTip({sourceType: 'element', source: '#anotherchurchtip', addClass: 'anotherchurchtip', hideSourceElement: true});

HTML markup:

	<img id="anotherchurch" src="church.jpg" border="1" />
	<div id="anotherchurchtip"><div class="header">The header!</div>..and a little description..</div>

Result:

..and a little description..

Example four:

Show the tooltip when hovering over the div with the id #hellodiv.
Use the text of the attribute "myownattr" as tooltip content.
Do not show the drop shadow.
Change the background color of the target when opening and closing the tooltip.

JavaScript code:

	$('#hellodiv').leviTip({sourceType: 'attribute', source: 'myownattr', dropShadow: false, onOpen:function(l, target){
		$(target).addClass('hover');
	}, onClose: function(l, target){
		$(target).removeClass('hover');
	}});

HTML markup:

	<div id="hellodiv" myownattr="just a hello div with some text" >hello</div>

Result:

hello

Example five:

Show the tooltip when clicking on the highlighted text.
Use the first child inside the target (#clicktip) as tooltip content and hide it on page load.

JavaScript code:

	$('#clicktip').leviTip({activateOn: 'click', sourceType: 'firstchild', hideSourceElement: true});

HTML markup:

	<span id="clicktip"><span>clickable tooltip</span>Click me</span> to show the tooltip!

Result:

clickable tooltipClick me to show the tooltip!