Fork me on GitHub

GIF添加3D加速

由于浏览器内核对Gif格式的图片会产生卡的情况,所以我们需要告诉浏览器,开启一下加速,方法很简单,就是利用css3的特性,强制告诉浏览器,这是个元素,需要3D转换,请务必开启加速效果

方法1

给gif开启3D独立层渲染,就是给图片一个0度角3D旋转,使动画图片只渲染最小区域,就是给gif添加样式transform: translate3d(0,0,0),gif动画会引起全屏重新渲染,开启3d动画目的是让git动画独立渲染

方法2

如果gif没有高保真的图片你可以按桢导入ai,然后导成矢量,github上有一个叫svgo的东西好像可以优化svg动画差值。好久没用过了,矢量导出svg格式

方法3

别用gif.用css动画或者canvas动画

posted @ 2016-09-16 20:47  _落雨  阅读(607)  评论(0编辑  收藏  举报