当用户将鼠标悬停在对象上时显示气球答案

【问题标题】：Displaying a balloon when user hovers over an object当用户将鼠标悬停在对象上时显示气球
【发布时间】：2014-09-18 14:34:59
【问题描述】：

我正在设计一个博客主题。我正在尝试制作一个信息气球，当用户将鼠标悬停在作者姓名上时会出现，类似于 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();
});

});

这是我设计的气球 https://dl.dropboxusercontent.com/u/28793409/Capture.JPG

它的页面http://bit.ly/1uKDY3V ，请将鼠标悬停在帖子的作者姓名上。我做了 HTML 和 CSS 部分，但我不擅长 Jquery 和 JS，所以请帮助我完成它。

【问题讨论】：

我不明白。你到底有什么问题？
您是否要制作工具提示？在 JQuery 中做工具提示的教程很多
是的，我正在尝试制作工具提示。但我的工具提示有点不同
您在网站上的气球似乎在我的 Opera 12 上运行良好...没什么奇怪的...您的问题是什么？

标签： jquery css balloon

【解决方案1】：

嘿，您可以查看系绳放置插件，该插件免费为您提供碰撞检测，并且有一个看起来几乎像您的图像的示例。

http://github.hubspot.com/drop/docs/welcome/

【讨论】：