(function($) {

	$.fn.msTooltip = function(options) {
		var opts = $.extend({}, $.fn.msTooltip.defaults, options);
		var title = '', htmlTitle = '';
		var tt = $('<div class="tooltip" style="display: none; position: absolute; z-index: 10000" />').appendTo("body");
		
		$(this).mouseover(function() {
			title = $(this).attr(opts.attr);
			$(this).attr(opts.attr, '');
			htmlTitle = "<span>" + title.replace(" - ", "</span><span>") + "</span>";
			tt.html(htmlTitle);
			tt.css(opts.styles);
			tt.show();
		}).mousemove(function(e) {
			tt.css({
				top: e.pageY + 23 + "px",
				left: e.pageX + 10 + "px"
			});
		}).mouseout(function() {
			tt.hide();
			$(this).attr(opts.attr, title);
		}).click(function() {
			tt.hide();
			$(this).attr(opts.attr, title);
		});
	}
	
	$.fn.msTooltip.defaults = {
		attr: 'title',
		styles: {}
	}

})(jQuery);
