/**
   * jQuery simpleTooltip plugin
   *
   * @author Marius ILIE (http://dev.mariusilie.net) / Improved by Aamir Afridi (http://www.aamirafridi.com - info@aamirafridi.com)
   * @date 2009-08-06
   * @example $("link").simpletooltip({html : 'My Tooltip', mouseOffset.x : 10 , mouseOffset.y : 12})
   * @example $("link").simpletooltip({ opacity : 0.8, css : { 'padding' : '8px' , 'border' : '2px solid #ccc' } })
   * @desc create a tooltip effect for any html element's title attribute or any text provided
   *
   * @name simpletooltip
   * @type jQuery
   * @param String - html - custom text which will overwrite the text in element's title attribute
   * @param String - errorText - text which will appear if there is no title attribute found or html provide to the plugin otherwise leaving this empty will diable the plugin
   * @param Number - cornerRadius - the radius of the round corner of the tooltip. Work only on Firefox 3+ and Webkit-base browsers
   * @param String - cssClass - if provided, It will overwrite any css provided to the plugin
   * @param Number - opacity - the transparency of the tooltip. From 0.0 to 1. Should work on IE but haven't tested
   * @param String - fadeSpeed - the animation speed of the tooptip to fadeIn
   * @param Number  - mouseOffset.x - the position of the tooltip on x-axis
   * @param Number  - mouseOffset.y - the position of the tooltip on y-axis
   * @param Array  - css - css properties will be applied on the tooltip
   * @cat Plugin
   */

  (function($,options){ $.fn.simpletooltip = function(){
          var      o = $.extend({}, $.fn.simpletooltip.defaults, options);
          return this.each(function() {                                    
                  var text = ($(this).attr("title")!='') ? $(this).attr("title") : o.errorText, st;
                  if(o.html=='' && text=='') return;
                  $(this).hover(function(e){
                          $(this).attr("title", "");
                          var tipX = e.pageX + o.mouseOffset.x,
                                  tipY = e.pageY + o.mouseOffset.y;
                                    st = $('<div></div>')
                                          .appendTo('body')
                                          .html(($.trim(o.html)!='') ? o.html : text)
                                          .fadeIn(o.fadeSpeed);
                                  if(o.opacity!=1) st.attr('style','opacity:'+o.opacity+'; filter:alpha(opacity = '+o.opacity*100+')');
                                  if($.trim(o.cssClass)!='') st.addClass(o.cssClass)
                                  else st.css($.extend({}, {'position':'absolute','z-index':100,'display':'none','-moz-border-radius'     :o.cornerRadius,'-webkit-border-radius' :o.cornerRadius,'left':tipX,'top':tipY+o.css}, o.css));
                  }, function(){
                          st.remove();
                          $(this).attr("title", text);
                  })
                  .mousemove(function(e){
                          var tipX = e.pageX + o.mouseOffset.x,
                                  tipY = e.pageY + o.mouseOffset.y,
                                  tipWidth = st.outerWidth(true),
                                  tipHeight = st.outerHeight(true);
                          if(tipX + tipWidth > $(window).scrollLeft() + $(window).width()) tipX = e.pageX - tipWidth;
                          if($(window).height()+$(window).scrollTop() < tipY + tipHeight) tipY = e.pageY - tipHeight;
                          st.css({'left':tipX,'top':tipY}).fadeIn(o.fadeSpeed);
                  });
           });
          }
 
          $.fn.simpletooltip.defaults = {
                  html            : '',
                  errorText       : '<b>Error:</b><br />No title attribute found<br />And no Html provide to the plugin.', //Leave it empty which will show nothing
                  cornerRadius: 0,        
                  cssClass        : '',
                  opacity         : 1,
                  fadeSpeed       : 'fast',
                  mouseOffset: {
                                                  x : 10,
                                                  y : 10
                                            },
                  css                     : {
                                                  'padding'       : 7,
                                                  'background': '#F2F3F5',
                                                  'border'        : '1px solid #A6A7AB',
                                                  'max-width'         : '500px',
                                                  'font-size'     : '12px'
                                            }
          };
      })(jQuery);