由于项目的需要，俺要做一些页面的转场动画。即将是移动端，肯定是首先css动画了。结果确发现，css动画中，如果设置animation-fill-mode: both;在动画结束后无法个性translate3d的值；起初，以为是项目过于复杂，代码之前造成了相互影响，可事实并非如何。 ...
由于项目的需要，俺要做一些页面的转场动画。
即将是移动端，肯定是首先css动画了。
结果确发现，css动画中，如果设置animation-fill-mode: both;在动画结束后无法个性translate3d的值；
起初，以为是项目过于复杂，代码之前造成了相互影响，可事实并非如何。
后来，我便写了个简单demo来测试；
css:
@keyframes slideInRight { 0% { visibility: visible; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { visibility: visible; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }}.slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; -webkit-animation-fill-mode: both; animation-fill-mode: both;animation-duration: .35s;}
原标题：css动画结束后 js无法修改translated值 .
关键词：JS
*特别声明：以上内容来自于网络收集，著作权属原作者所有，如有侵权，请联系我们：
admin#shaoqun.com
（#换成@）。
