$(document).ready(function(){

var $ttip = false;

    $('.ttip').each(function(){
            content = $(this).attr('title');
            $(this).attr('ttiptitle',content);
            $(this).removeAttr('title');        
    });

    $('.ttip').hover(
        function(e)
        {
            $content = $(this).attr('ttiptitle');
            $(this).removeAttr('title');
            
            if(!$ttip)
            {
                $(document.body).append("<div id=\"ttip_cont\"></div>");
                $ttip = $('#ttip_cont');
                $ttip.css('top',e.pageY-20 + 'px');
                $ttip.css('left',e.pageX+20 + 'px');
            }
            $ttip.html($content);
            $ttip.show();
        
        },
        function()
        {
            if($ttip)
            {
                $ttip.hide();
            }
        }
    );

    $('.ttip').mousemove(
        function(e)
        {            
            if($ttip)
            {
                $dw = $(document).width();
                $dh = $(window).height()+$(window).scrollTop();

                $left = $ttip.width()+50>$dw-e.pageX ? e.pageX-$ttip.width()-20 : $left = e.pageX+20;

                $top  = $ttip.height()+50>$dh-e.pageY ? e.pageY-$ttip.height()-20 : $top = e.pageY-20;

                $ttip.css('top', $top + 'px');
                $ttip.css('left', $left + 'px');
            }
        }
    );

});