我如何精确地对动画进行时间编排？

Question

我想知道如何控制纺织动画的时间。

我有一个带有动画背景的页面（使用反向拉伸动画并带有图像数组），每个图像在屏幕上停留2200毫秒 我该如何在2200毫秒内将加弹的IN和OUT定时完成动画？

我已尝试更改animate.css中的计时，但这仍然不能告诉我在IN动画播放后它在屏幕上停留了多长时间，所以我不知道我的IN +显示时间+ OUT动画时间为。

这是JS-

$(document).ready(function () {
    // Backstretch
    $("header").backstretch([
        "assets/img/bg-1.jpg",
        "assets/img/bg-2.jpg"
        "assets/img/bg-3.jpg"
        "assets/img/bg-4.jpg"
        "assets/img/bg-5.jpg"
        "assets/img/bg-6.jpg"
        "assets/img/bg-7.jpg"
        "assets/img/bg-8.jpg"
        "assets/img/bg-9.jpg"
    ], {duration: 2200 , fade: 900});

    // Text rotator
    $('.rotate').textillate({
        in: {
            effect: 'fadeInUp',
            shuffle: false,
            sync: false,
        },
        out: {
            effect: 'fadeOutUp',
            shuffle: false,
            sync: false,
        },
        loop: true
    });
);