jQuery - mouseover（）/ fadeIn（）无效

Question

http://jsfiddle.net/rR6gC/

每当有人将鼠标按在每个栏上时，我都会尝试在栏内显示信息，但它根本不起作用。我能够从纯CSS做出反应，但在尝试使用jQuery函数时，没有任何效果。

JavaScript / jQuery

$('.score').mouseover(function () {
    $(this).fadeIn('slow');
});
$('.score').mouseeleave(function () {
    $(this).fadeOut('slow');
});

CSS

.score{
color:white;
font-size:2em;
width:100%;
text-align:center;
display:inline-block;
position:relative;
}

Answer 1

根据我的理解，您想隐藏5并在鼠标悬停在栏上时显示

1. mouseeleave
中有拼写错误
2. 你需要为bar wrapper元素编写mouseenter和mouseleave事件，然后在鼠标进入/离开时显示/隐藏其中的score元素

尝试

$('.scoreWrap2 .score').hide()
$('.scoreWrap2').mouseover(function () {
    $(this).find('.score').stop(true, true).fadeIn('slow');
});
$('.scoreWrap2').mouseleave(function () {
    $(this).find('.score').stop(true, true).fadeOut('slow');
});

演示：Fiddle