具有一个时间轴的jQuery滑块切片效果

我试图用一个时间线来实现延迟的切片效果

具有切片效果的演示页面，无延迟：
演示页面：

实现延迟的最佳方法是什么：

守则：

/**
* animation step event
*/
$container.on('animationStepEvent', function(e, percent){       

    var maxSlideWidth = WIDTH/SLIDES_NUM
        ,width = percent*maxSlideWidth/100
        ,opacity = percent*1/100;

    $blocks.each(function(index, value){

        var left = maxSlideWidth * index
            ,height = percent*HEIGHT/100;

        $(this).css({
            width: width
            ,height: height
            ,opacity: opacity
            ,left: left
            ,'backgroundPosition': '-' + maxSlideWidth*index + 'px 0'
        });
    });
});

更新：

似乎一条时间线是不可能的，
我能达到的最接近的效果是：

感谢这个问题：

---

我想您正在使用AviaSlider插件？或者你想做一些看起来像它的东西吗？不，AviaSlider插件只是我想要达到的效果的一个例子。你可以通过一个数组和一个定时器来实现这一点。在数组中循环，并在其中设置几毫秒的计时器。因此，您还需要为切片提供一个静态值，比如ID。谢谢，这是一个选项。但是我想知道是否可以使用一个计时器对象（比如这里：）？