我在一个.less中有这个mixin:
.transition(@transition) {
transition: @transition;
-webkit-transition: @transition;
-moz-transition: @transition;
}
mixin用于下一个。less:
.animate-epg-now.ng-enter {
.transition(left @transition-duration @transition-type @transition-delay);
z-index: -1;
display: block !important;
left: -@transition-displacement;
}
编译后的css为:
.go-mdl-epg-drct-main-epg .animate-epg-now.ng-enter {
transition: left 0.2s ease-out 0;
-webkit-transition: left 0.2s ease-out 0;
-moz-transition: left 0.2s ease-out 0;
z-index: -1;
display: block !important;
left: -400px;
}
在Chrome、Safari、IE中,它的工作非常完美,但在firefox中,过渡线已被删除!,在firebug中,我看到了源css,这是firefox的结果:
.go-mdl-epg-drct-main-epg .animate-epg-now.ng-enter {
display: block !important;
left: -400px;
z-index: -1;
}
我无法解释,可以肯定的是,在Chrome中,我看到了相同的css和转换语句,并且转换有效,为什么firefox会丢弃这些行?
问题是时间上的单元0,就像这个线程所说的,firefox正确地实现了标准,我必须将转换延迟更改为0s