$.fn.tooltip = function(settings) {
    var defaults = {
        color: '#fff',
        bgColor: '#ccc',
        fontSize: '10',
        width: '180',
        cursor: 'pointer'
    }

    $(this).mouseover(function(e) {
        settings = $.extend(defaults, settings);

        var tip = $(this).attr('title');
        $(this).attr('title','');
        $('body').append('<div id="tooltip"><div class="tipBody">' + tip + '</div></div>');
        $('#tooltip').fadeIn('500');

        $('#tooltip').css('position','absolute');
        $('#tooltip').css('z-index','9999');
        $('#tooltip').css('color',settings.color);
        $('#tooltip').css('font-size',settings.fontSize+'px');
        $('#tooltip').css('width',settings.width+'px');
        $('#tooltip').css('border','1px solid '+settings.borderColor);

        $('#tooltip .tipBody').css('background-color',settings.bgColor);
        $('#tooltip .tipBody').css('padding','5px 5px 5px 15px');

    //$('#tooltip').fadeTo('10',0.9);
    }).mousemove(function(e) {
        $('#tooltip').css('top', e.pageY  + 1 );
        $('#tooltip').css('left', e.pageX  + 1 );
    }).mouseout(function() {
        $(this).attr('title',$('.tipBody').html());
        $('body').children('#tooltip').remove();
    })

}