Question

因此，我试图在页面上移动动画，并在转换完成后更改它的position属性。但transitionend事件过早发射，我无法弄清楚原因。见答案。

Answer 1

TL; DR

可见性转换比其他属性更快。将所需属性放在回调内的条件中。

过了一段时间，我发现由于某些原因，可见性转换速度比其他属性快得多。不知道为什么。所以在我将transitionend回调的主体置于某个条件之后，它就可以了。

.on('transitionend webkitTransitionEnd oTransitionEnd' +
                ' MSTransitionEnd', function (e) {
                console.log(e.originalEvent.propertyName);
                //visibility transitions way too soon
                if (e.originalEvent.propertyName == 'top') {
                    $('#' + card.attr('id') + '-placeholder').remove();
                    card.css({
                        'top': '',
                        'left': '',
                        'width': '',
                        'height': '',
                        position: ''
                    }).removeClass('top');
                    console.log('end');
                    card.off('transitionend webkitTransitionEnd oTransitionEnd' +
                        ' MSTransitionEnd');
                }
            });

另外，我必须使用on而不是one，因为之后只会触发可见性，因此我之后必须手动off。

Transitionend事件太快了

1 个答案:

TL; DR