jquery - 悬停延迟的jQuery动画3个div

Question

我正在尝试创建一种效果，其中我将鼠标悬停在一个 div 上（使用“hover”类）和 3 个其他 div（“agent”、“fav”和“more_details”）向上移动但在 3 个之间有短暂的延迟他们。然后，当我悬停时，所有 3 个 div 同时向下移动。这是我目前正在尝试的代码，

jQuery(document).ready(function() {
jQuery(".hover").hover(
    function(){
    jQuery(".agent").animate({top: '-=32px'},400);
    },
    jQuery(".fav").animate({top: '-=32px'},400).delay(800);
    },
    jQuery(".more_details").animate({top: '-=32px'},400).delay(1600);
    },

    function(){
    jQuery(".agent,.fav,.more_details").animate({top: '+=32px'},400);
    }
);                              
});

谁能帮我在这里正确地编写我的代码。

Answer 1

.delay延迟链接到它的 fx 操作，而不是链接到它的操作：

jQuery(".fav").delay(800).animate({top: '-=32px'},400);
jQuery(".more_details").delay(1600).animate({top: '-=32px'},400);