MooTips.v1.11

Title

EVAL (click me)

AJAX

DOM

EVAL

AJAX (error)

Script: MooTips.js
	Tooltips, BubbleTips, whatever they are, they will appear on mouseover

License:
	MIT-style license.

Credits:
	The idea behind Tips.js is based on Bubble Tooltips (<http://web-graphics.com/mtarchive/001717.php>) by Alessandro Fulcitiniti <http://web-graphics.com>
	MooTips.js is based on Tips.js.
		Modified by razvan@e-magine.ro (<http://www.e-magine.ro/>): 
			allow AJAX and DOM usage
		Modified by Vladimir Prieto (<http://vladimirprieto.blogspot.com>): 
			prevent "fixed" tips from hiding onmouseenter of the tip
		Modified by uhleeka@gmail.com:
			allow EVAL usage

Class: MooTips
	Display a tip on any element with a title and/or href.

Note:
	Tips requires an XHTML doctype.

Arguments:
	elements - a collection of elements to apply the tooltips to on mouseover.
	options - an object. See options Below.

Options:
	showOnClick - set to true to display the tooltip onclick; defaults to false;
	showOnMouseEnter - set to false to prevent the tooltip from displaying onmouseenter; defaults to true;
	
	maxTitleChars - the maximum number of characters to display in the title of the tip. defaults to 30.

	onShow - optionally you can alter the default onShow behaviour with this option (like displaying a fade in effect);
	onHide - optionally you can alter the default onHide behaviour with this option (like displaying a fade out effect);

	showDelay - the delay the onShow method is called. (defaults to 100 ms)
	hideDelay - the delay the onHide method is called. (defaults to 100 ms)

	className - the prefix for your tooltip classNames. defaults to 'tool'.

		the whole tooltip will have as classname: tool-tip

		the title will have as classname: tool-title

		the text will have as classname: tool-text

	offsets - the distance of your tooltip from the mouse. an Object with x/y properties.
	fixed - if set to true, the toolTip will not follow the mouse.
	
	loadingText - text to display as a title while loading an AJAX tooltip.
	
	errTitle, errText - text to display when there's a problem with the AJAX request.

	evalAlways - set to true when using the AJAX or EVAL methods to handle the request on every mouseover; set to false to cache the value of the first attempt; defaults to false;

Example:
	(start code)
	<div>
	<img src="images/moo.png" title="Title::The content of the tooltip is stored in the &quot;title&quot; attribute" class="toolTipImg"/>
	<h4>Title</h4>
	
	<img src="images/moo.png" title="EVAL:'Eval Title\:\:' + Date() + '<br /><br />[Note the escaped delimiters]'" class="toolTipImgEVAL1"/>
	<h4>EVAL (click me)</h4>
	
	<img src="images/moo.png" title="AJAX:lipsum.htm" class="toolTipImgAJAX"/>
	<h4>AJAX</h4>
	
	<img src="images/moo.png" title="DOM:HiddenElementID" class="toolTipImgDOM"/>
		<div style="display:none;" id="HiddenElementID">DOM Title::DOM Tooltip body<br /><br /><img src="images/moo.png" width="124" /></div>
	<h4>DOM</h4>
	
	<img src="images/moo.png" title="EVAL:myEvalFunction()" class="toolTipImgEVAL2"/>
	<h4>EVAL</h4>
	
	<img src="images/moo.png" title="AJAX:invalidurl.htm" class="toolTipImgAJAX_Err"/>
	<h4>AJAX (error)</h4>
	</div>
	<script>
		window.onload = function() {
			var myTips1 = new MooTips($$('.toolTipImg'), {
				maxTitleChars: 50		// long caption
			});
			var myTips2 = new MooTips($$('.toolTipImgDOM'), {
				showDelay: 500			// Delay for 500 milliseconds
			});
			var myTips3 = new MooTips($$('.toolTipImgAJAX'), {
				evalAlways: true,		// always run the eval statement
				maxTitleChars: 100,		// very long caption
				fixed: true,			// fixed in place; note tip mouseover does not hide tip
				offsets: {'x':100,'y':100} // offset by 100,100
			});
			var myTips4 = new MooTips($$('.toolTipImgEVAL1'), {
				evalAlways: true,		// always run the eval statement
				showOnClick: true,		// click image to show tooltip
				showOnMouseEnter: false	// do not show on mouse enter
			});
			var myTips5 = new MooTips($$('.toolTipImgEVAL2'), {});
		}
		function myEvalFunction() {
			return 'Eval Function Title::Text to be displayed in the body of the tooltip';
		}
	</script>
	(end)

Note:
	The title of the element will always be used as the tooltip body. If you put :: on your title, the text before :: will become the tooltip title.
	If you put DOM:someElementID in your title, $('someElementID').innerHTML will be used as the tooltip contents (same syntax as above).
	If you put AJAX:http://www.example.com/path/to/ajax_file.php in your title, the response text will be used as the tooltip contents (same syntax as above). Either absolute or relative paths are ok.
	If you put EVAL:somethingToEval in your title, the eval(somethingToEval) response text will be used as the tooltip contents (same syntax as above).