(function($){
$.fn.extend({
//plugin name - animatemenu
tooltip: function(options) {
var defaults = {
TipWidth: '70%', //can be '30px' etc//
TipFontSize: 'small',
TipbackgroundColor: '#ccc',
TipforeColor: '#00c',
TipBorder: 'solid 2px #f00',
TipPadding: '20px',
HeadbackgroundColor:'lightgreen',
HeadColor: '#900',
HeadWidth: 'auto', //can be '30px' etc//
HeadPadding: "6px", //can be '30px' etc//
XLeftOffset: 50,
YTopOffset:10,
};
var options = $.extend(defaults, options);
return this.each(function() {
var o = options;
$('.tt').css({'cursor':'default','background-color': o.HeadbackgroundColor,'color': o.HeadColor,'width': o.HeadWidth,'padding': o.HeadPadding});
$(".tip").css({'position':'absolute','display':'none','background-color': o.TipbackgroundColor,'width': o.TipWidth, 'border': o.TipBorder,'padding': o.TipPadding,'color': o.TipforeColor,'font-size':o.TipFontSize});
$(".tip p").css({'margin':'0px'});

var obj = $(this);
var items = $(".tt");

items.mouseover(function(e) {
var num= $(".tt").index(this);
var obj=$('.tip:eq('+ num +')');

var objWidth =$(obj).width();
objWidth=(50);
var docWidth=$(document).width()/2;
docWidth=(0);

o.XLeftOffset=objWidth;e.pageX=docWidth;

obj.show().css({'top' :  (e.pageY + o.YTopOffset)  , 'left' : (e.pageX + o.XLeftOffset) });;
return false;
}).mousemove(function(e) {
//Keep changing the X and Y axis for the tooltip, thus, the tooltip move along with the mouse
o.XLeftOffset=objWidth;e.pageX=e.pageX=docWidth;
$('.tip').css('top', e.pageY +  o.YTopOffset );
$('.tip').css('left', e.pageX - o.XLeftOffset );
}).mouseout(function() {
$('.tip').hide();
});
});
}
});
})(jQuery);



