javascript - jQuery - div 动画 : on mouse over, 其他 div 更改其位置

Question

我正在开发一个 jQuery 动画，它可以在鼠标输入时扩展 div.panel 的高度，并在鼠标离开时将其收缩回正常状态。

动画适用于选定的 div.panel，但问题与当鼠标悬停在 div.panel.panel 上时从其初始位置向下移动的附近元素有关-大。

这是一个fiddle .

Answer 1

我猜你想要 <li> s 展开，而不是整个 panel 。问题是您选择 .panel ，这适用于整个事情。

fiddle

JavaScript:

$(document).ready(function () {
    $("li", this).hover(function () {
        $(this).animate({
            "height": "+=25px"
        }, "fast");
    }, function () {
        $(this).animate({
            "height": "-=25px"
        }, 300);
    });
});

请注意 $(".panel", this).hover(…) 的更改至$("li", this).hover(… 。这会导致这些片段在鼠标移入和移出时正确扩展/收缩。

告诉我这是否不是预期的行为。