jquery - 如何停止 jquery 悬停时的额外间距？

Question

当我通过悬停将鼠标悬停在某些图像上时，格式包括底部的额外间距。 http://jsfiddle.net/44jQa/72/ .这发生在前两个图像中。此外，当内容出现在悬停时，有时会保留旧内容。当悬停很快并且旧内容不会淡出时会发生这种情况。我该如何解决这些问题？

这是我的js:

function showPart(id) {
    $('#content .part' + id).fadeIn('400').addClass('show');
}
$('li').on('mouseenter', function () {
    $(this).find('img').fadeTo(400, 1);
    $(this).find('img').addClass("LHover");
    var id = $(this).data('id');
    if ($('.show').length == 0) {
        showPart(id);
    } else {
        $('.show').removeClass('show').fadeOut('100', function () {
            showPart(id);
        });
    }
}).on('mouseleave', function () {
    $(this).find('img').fadeTo(400, '.5');
    $(this).find('img').removeClass("LHover");
});

Answer 1

这是边框造成的。在悬停时添加边框会导致高度增加一点并将第二行中的 block 向右移动。

Demo

.LHover {
    border: 1px solid #000;
}