Question

我将following animation配置为淡入淡出并将块滑动到“鼠标悬停”视图中，只有淡出并在“mouseout”上再次滑动它。但是，如果我再次将鼠标移回容器DIV，则会从错误的位置开始进行相同的动画。如何让它重置回起始位置？如果可能的话，我想避免添加另一个动画来将其移回原始位置。

$(".box").css("opacity",0);
    $(".container").mouseover(function () {
        $(".box").stop(true, true).animate({top:99, opacity: 1},150);
    });
    $(".container").mouseout(function () {
        $(".box").stop(true, true).animate({top:59, opacity: 0},150);
    });

Answer 1

在开始第一个动画之前，只需将其重置为隐藏的最高值。我在示例中添加了值("top", 50)，但您可以填写所需的实际起始值：

$(".box").css("opacity",0);
$(".container").mouseover(function () {
    $(".box").stop(true, true).css("top", 50).animate({top:99, opacity: 1},150);
});
$(".container").mouseout(function () {
    $(".box").stop(true, true).animate({top:59, opacity: 0},150);
});

重置动画后

1 个答案: