ng-enter-stagger动画无法在safari上工作

Question

我有一个ng-enter-stagger动画，适用于chrome和firefox，但不适用于safari。

我以-webkit为前缀的转换定义，但它不适用于safari。 >供应商在CodePen加前缀 - 为问题

.animate-repeat.ng-enter-stagger, 
    .animate-repeat.ng-leave-stagger { 
     -webkit-transition-delay: 400ms; 
     -webkit-transition-duration: 0s; 
     transition-delay: 400ms; 
     transition-duration: 0s; 
    } 

Answer 1

的演示对于在Safari中快速检查看到这个codepen，我下CSS设置开启autoprefixer。这似乎修复了最新的Safari，因为效果看起来不错。如果您有任何构建步骤，我强烈建议将Autoprefixer添加到组合中。如果你这样做，问题解决了！

如果你是一个DIYer来说，当你的供应商前缀属性和使用过渡/转换，你必须供应商名称的属性值，以及：在您链接的CodePen

.animate-repeat.ng-enter, 
    .animate-repeat.ng-leave { 
     -webkit-transition: -webkit-transform 1750ms; 
     transition: transform 1750ms; 
    } 

在一些情况下，到上面，你没有这样做。这样做应该解决问题！您在某些浏览器中使用某些效果的原因是因为它们支持您正确编写的未加前缀的版本。

另一个hacky解决此类问题的方法是使用-webkit-transition: all而不是指定所有不同的属性，但这会影响任何和所有更改的属性。