我正在设计一个博客主题。我正在尝试制作一个信息气球,当用户将鼠标悬停在作者姓名上时会出现,类似于 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,所以请帮助我完成它。