用js给元素添加删除class来控制元素的现实和隐藏这个会把
你只需要在页面加载完成后执行js
给你要添加动画的元素上加一个 例如play的class
然后你所有css3的动画 都是基于play这个class 的 就行了
这个简单,先讲一下原理
先设置图片垂直水平居中(position：absolute与translate3d 相结合) class为img
2.可以编写自定义animation 0的时候width为0，100%的时候width为你想要的宽度,高一样，其他的改设置的都设置一下 class为img active(这里是两个class) 来使用这个animation
3.在window.onload的事件下执行 只需给 img再加一个active的class就ok了
注意：我之前有在写自定义动画的时候在微信端执行不了动画，之后找到原因，给animation加一个延迟 100ms就行了 如果你遇到这种问题可以试试。
最好的解决办法就是用个GIF动画代替，这样即使是最古老的浏览器都没有问题，而且运行效率与css3实现的动画不相上下。这要看你的网页侧重于哪种浏览设备。如果是主要用于移动设备如手机上的浏览器的，可以放心大胆地使用css3的特效，因为几乎所有智能手机上的浏览器都是支持css3标准的；如果是主要用于电脑的，则尽量避免使用css3中的新特性，改用最兼容、最稳妥的方法，因为它面对的是形形色色、标准极其不统一的多种浏览器；如果是手机和电脑都要兼顾到的网页，则也要坚持“就低不就高”的原则，在兼容性与炫酷之间选择前者。
