MooTools Tip - class

Html

<a href=# class=Tip title='Tip content'>Tip</a>

Javascript

if($$(.Tip) != null){new NaMooTIP();}
var NaMooTIP = new Class({

initialize: function(){this.tip = $$(.Tip);this.tipStyle();this.tipAction();},

tipAction: function(){this.tip.each(function(el,i){el.addEvents({mousemove: function(e){this.tooltip.setStyles({top:e.page.y +10});this.tooltip.setStyles({left:e.page.x + 10});}.bind(this),

mouseenter: function(){this.tx='';this.tx = el.get(title);this.tooltip.set(html,this.tx);el.set(title,'');this.tooltip.setStyles({opacity:1});this.tooltip.fade(in);}.bind(this),mouseleave: function(){el.set(title,this.tx);this.tooltip.fade(out);}.bind(this)});},this);},

tipStyle: function(){this.tooltip = new Element(div,{styles: {opacity:0,color:#fff,padding:7px,position:absolute,background:#000,z-index:1000,font-size:13,-webkit-box-shadow:'0 0 10px #fff',box-shadow:'0 0 10px #fff'}}).inject(document.body,top);}});