Question

我正在创建一个小型库，用css过渡动画div。到目前为止这么好，我喜欢它比jquery动画更好，因为使用动画制作更复杂的动画使我的代码不可读。无论如何这是我的主要功能：

    this.effect = function (element, effect, delay) {
        var currentEffect = effect.shift();
        var currentDelay = delay.shift();
        var animationName = "animated " + currentEffect;
        var animationEnd = "webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend";

        $(element).addClass(animationName).one(animationEnd, function () {
//          $(this).removeClass(animationName);
            if ( effect.length > 0 ) {
                $(this).css('-webkit-animation-delay', currentDelay + 's' )
                display.effect( element, effect, delay )
            }
        })
    }

这段代码采用＆＃34;元素＆＃34;它可以是div或以jquery表示法打印的任何东西，效果，这是一组效果（来自animate.css），延迟也是一个延迟每个动画的数组。我称之为：

display.effect(".title", [ "swing", "shake" ], [ 10, 11 ])

所有这一切都完美无缺，没有一个小例外：如果我想将div从视口外部滑动到它的中心（或任何地方），初始位置将是底部：-500px。在动画之后它有例如bottm：500px。但是当动画超过类时，我的div移动到500px被移除，所以它再次转到-500px（或任何其他初始参数），即使它根本没有设置。您是否有任何流畅的想法如何使我的动画元素保持动画完成后保持的所有参数？ Kalreg

css transition和jquery - 在删除类后保留动画值

0 个答案: