jQuery(document).ready(function() {
    jQuery('.jtooltip').focus(function(){
        var title = jQuery(this).attr('title');	
        var pos = jQuery(this).offset();
        var inputwidth = jQuery(this).width();
        if(jQuery(this).hasClass('top')){
            var posleft = pos.left;
            var postop = pos.top-55;
        }else{					
            var posleft = pos.left + inputwidth + 20;
            var postop = pos.top-5;
        }

        jQuery('body').append('<span class=jtooltip-bubble>' + title + '</span>');
        if(jQuery(this).hasClass('top')){
            jQuery('.jtooltip-bubble').addClass('top-arrow').removeClass('left-arrow');	
        }else{
            jQuery('.jtooltip-bubble').addClass('left-arrow').removeClass('top-arrow');	
        }
        
        jQuery('.jtooltip-bubble').css({'display': 'block','left': posleft, 'top': postop});

    }).blur(function(){
        jQuery('.jtooltip-bubble').remove();	
    });

});