jQuery旋转器从一个旋转到另一个，而不是逐渐衰减

我尝试编写一个简单的jQuery旋转器，以在小部件中显示不断变化的HTML内容

小部件本身工作，每个div淡入淡出，但它们似乎重叠，导致两个div在瞬间显示

如何使可见div淡入淡出，在显示为无后，另一个div开始淡入

function fadeNext() {
    $('#patient-stories .patient-story-single').first().fadeOut('slow').appendTo($('#patient-stories .inner'));
    $('#patient-stories .patient-story-single').first().fadeIn('slow');
}

更新：

我试着靠近了一点，在下一个div消失之前，每个div都会消失，但它不会循环，也就是说，当所有div都显示出来后，返回到开始

已解决：

---

将连续的动画放在前一个回调中，以确保它们遵循顺序

函数fadeNext（）{
$（'#div1'）.fadeOut（'slow'，function（）{
$（'#div2'）.fadeIn（'slow'）；
});
}

我不认为它像这样简单，因为这会将它们显示为一个div，并将它们作为一个div进行淡入淡出-设法让它工作起来，但需要一些技巧，谢谢你的回答，这让我朝着正确的方向前进！这是你自己的一个实践例子吗？我选择不使用插件，只是为了减少不必要的东西并保持它的轻量级。另外，它需要少一个库来加载！