有没有办法可以检查是否会发生css转换？

Question

我使用Javascript对对象进行了转换：

$(this).css('transition', 'all 1000ms');

我听过渡结束事件：

$(this).on('webkitTransitionEnd', function() { alert('Transition did finish.'); });

触发事件，一切按预期工作。但是，当元素以'left：100px'开头并且您尝试将其设置为'left：100px'时，事件永远不会被触发，这会导致问题。我该如何解决这个问题？我无法真正检查新值的值，因为

$(this).css('transform', 'scale(0.1)'); //only when object is being displayed will return matrix value

scale(0.5) does not equal matrix(0.5, 0, 0, 0.5, 0, 0 )

Answer 1

如果您的属性相同，则不会发生webkit-transition，因此不会触发webkitTransitionEnd！

我帮忙解释一下：http://jsfiddle.net/JtLAX/

所以你必须在这里找到一个不同的方法来回调函数。

每当触发转换的事件开始时，您可能想要添加setTimeout（function（）{}，1000）。

或者您可以尝试使用此库，它可以非常有效地管理转换和设置回调：

http://ricostacruz.com/jquery.transit/

用它你可以简单地

$(this).transit({ left: '+=200' }, function() { alert('transition ends' } );

关于你的主要问题：

有没有办法可以检查是否会发生css转换？

恕我直言，我认为唯一的解决方案是手动检查样式元素的属性，并将它们与过渡进行比较，这非常困难。