Javascript 第一个jQuery.animate（）不工作

我对jQuery、JavaScript等非常陌生 我一直在努力制作一些动画：

目前，我在这里有一个部分工作演示：

多亏了jwags，第二个.animate（）可以工作

我一直在尝试实现相同的动画效果，以便替换.slideDown（）

我的最新尝试可以在这里找到：

请注意，如果继续处理此问题，代码将发生更改

function anim_loop(index) {
  $(elements[index]).css({top: 0, display: 'none'}).animate({top: -75},1000, function() {
    var $self = $(this);
    setTimeout(function() {
        $self.animate({top: $(window).height() + 10}, 1000);
        anim_loop((index + 1) % elements.length);
        }, 3000);
    });
}

---

您设置了

显示：无

，但之后从不显示

在

setTimeout（）

中，在

animate（）之前使用
css（'display'，'block'）
：

通过在初始化时设置
opacity:0
，在第二次
animate（）

编辑
要使第一个循环与其他循环一样工作，您必须在元素呈现在屏幕上之前显示它们，方法是在
动画（）之前设置
显示：块
：

所以你要隐藏它，然后设置它的动画？看起来你永远也看不到它了……谢谢你的提示，我已经设法让它几乎正常工作了。但是，在第一个循环中，它不能正常工作。它只是毫无停顿地完成了，非常感谢。将其移动到那里也会使过渡看起来更平滑。
setTimeout(function() {
    $self.css('display','block').animate({top: $(window).height() + 10}, 1000);
        anim_loop((index + 1) % elements.length);
    }, 3000);
});

function anim_loop(index) {
  $(elements[index]).css({top:-75, display: 'block'}).animate({top: '+0'},1000, function() {
        var $self = $(this);
        setTimeout(function() {
$self.animate({top: $(window).height() + 10}, 1000);
            anim_loop((index + 1) % elements.length);
        }, 3000);
    });
}