(function($) { $.fn.brTip = function(opts) { opts = $.extend({ fadeIn: 'slow', fadeOut: 'slow', toShow: 100, toHide: 500, opacity: 0.9, top: 35, left: 75, title: 'Help', box: null, delayToShow: null, delayToHide: null, txt: 'Testing' }, opts); function _clearTimes() { clearTimeout(opts.delayToShow); clearTimeout(opts.delayToHide); } function _create() { _clearTimes(); if (!opts.box) { opts.box = $('<div class="brTip-box"><div class="brTip-title">&nbsp;</div><div class="brTip-content">&nbsp;</div></div>').appendTo('body'); opts.box.css('opacity', opts.opacity);	 } opts.box.find('div.brTip-title').html(opts.title); opts.box.find('div.brTip-content').html(opts.txt); opts.delayToShow = setTimeout(function() { opts.box.fadeIn(opts.fadeIn); }, opts.toShow); } function _hide() { opts.delayToHide = setTimeout(function() { opts.box.fadeOut(opts.fadeOut); }, opts.toHide); } function _setPos(top, left) { if (opts.box) { opts.box.css({ top: top + opts.top, left: left + opts.left }); } else { setTimeout(function() { _setPos(top, left); }, 100); } } return this.each(function() { var self = $(this); self .mouseover(function() { self.attr('title', ''); _create(); }) .mouseout(function() { self.attr('title', opts.txt); _hide(); }) .mousemove(function(e) { _setPos(e.pageY, e.pageX); }) .focus(function() { self.trigger('mouseover'); var pos = self.offset(); _setPos(pos.top + (self.width() / 2), pos.left + (self.height() / 2)); }) .blur(function() { self.trigger('mouseout'); }) }); }; }(jQuery));