Jquery 当用户将鼠标悬停在对象上时显示引出序号

我正在设计一个博客主题。我正在尝试制作一个信息气球，当用户将鼠标悬停在作者的名字上时，它会出现，类似于Facebook气球，当我们将鼠标悬停在名字上时，气球会出现，当光标离开名字或气球时，气球会消失

这样地 dl.dropboxusercontent.com/u/28793409/baloon.jpg

我尝试过一些Jquery，但总是有问题，因为我希望当用户在气球上时，不要隐藏它。我知道我的jquery代码是一场灾难：D

$(function() {          
var authorInfo = $('.author-info');

$('.author').hover(function() {
    $(this).find('.author-info').delay(700).fadeIn();
});


$('.author-info').mouseleave(function(){
    authorInfo.fadeOut();
});

$('.close').hover(function(){
    authorInfo.fadeOut();
});

$('.close').hover(function(){
    authorInfo.fadeOut();
});

$('#sereen').hover(function(e){
  e.stopPropagation();
});

authorInfo.hover(function(e){
e.stopPropagation();
});

});

这是我设计的气球

这就是那一页

---

，请将鼠标悬停在帖子上的作者姓名上。我做了HTML和CSS部分，但我不擅长Jquery和JS，所以请帮我做。

嘿，你可以查看tether drop插件，它免费为你提供碰撞检测，并且有一个看起来几乎像你的图像的示例

---

我不明白。你到底有什么问题？你是不是想做一个工具提示？在jQueryes中有很多关于做工具提示的教程，我正在尝试做一个工具提示。但我的工具提示有点不同你网站上的气球似乎和我的Opera 12配合得很好…没什么奇怪的…你有什么问题？