由于浏览器内核对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动画

GIF添加3D加速的更多相关文章

  1. cesium编程入门（六）添加 3D Tiles，并调整位置，贴地

    添加 3D Tiles,并调整位置 3D Tiles 是什么 3DTiles数据集是cesium小组AnalyticlGraphics与2016年3月定义的一种数据集,3DTiles数据集以分块.分级 ...

  2. VirtualBox VM启用3D加速

    默认情况下，是不支持 DX3D的， 我们运行 dxdiag 看到的情况如下： 安装时也提示需要安全模式下才能安装 VirtualBox 必须在Windows安全模式下才能成功安装3D加速驱动。 重启系 ...

  3. cesium编程入门(六)添加 3D Tiles，并调整位置，贴地

    添加 3D Tiles,并调整位置 3D Tiles 是什么 3DTiles数据集是cesium小组AnalyticlGraphics与2016年3月定义的一种数据集,3DTiles数据集以分块.分级 ...

  4. 在WPF中添加3D特性

    原文:在WPF中添加3D特性 35.4  在WPF中添加3D特性 本节介绍WPF中的3D特性,其中包含了开始使用该特性的信息. 提示: WPF中的3D特性在System.Windows.Media.M ...

  5. [Altium Designer 学习]怎样添加3D模型

    对于为给PCB添加3D模型,很多人觉得这是个绣花针的活,中看不中用.在我看来这也未必,特别是常用的3D模型能在网上下载的今天,只需要几个简单的操作,就能使你的PCB更加赏心悦目.除此之外,3D模型还有 ...

  6. CSS3 03. 3D变换、坐标系、透视perspective、transformZ、transform-style添加3D效果、backface-visibility元素背面可见、动画animation、@keyfarmes、多列布局

    1.左手坐标系 伸出左手,让拇指和食指成“L”形,大拇指向右,食指向上,中指指向前方.这样我们就建立了一个左手坐标系,拇指.食指和中指分别代表X.Y.Z轴的正方向.如下图 CSS中的3D坐标系 CSS ...

  7. Docker添加官方加速源（必须）

    在国内使用Docker必须用加速镜像不然的话无论是pull 官方的还是私有的镜像都会WAIT TIME EXCEED 下面给出macos的添加方式,非常简单 macOS 对于使用 macOS 的用户, ...

  8. transform 的旋转 ，3d效果，要添加3d效果的父级加上景深perspective。 3d效果的容器加上 transform-style：preserve-3d。

    该技术用于创建一个多维的数据,在这个实例中使用了两个元素用于正面和反面.前面用来放置产品图片,底部用来放置产品信息.默认情况下产品信息隐藏起来,同时鼠标悬停在产品图片上时,隐藏在底部的产品信息在X轴放 ...

  9. tableview cell添加3D动画

    当cell显示之前,会先调用该方法,因此给cell添加动画,在这个方法里面即可. -(void)tableView:(UITableView *)tableView willDisplayCell:( ...

随机推荐

  1. ORM for Net主流框架汇总与效率测试

    框架已经被越来越多的人所关注与使用了,今天我们就来研究一下net方面的几个主流ORM框架,以及它们的效率测试(可能会有遗漏欢迎大家讨论). ORM框架:Object/Relation Mapping( ...

  2. uva 10154 - Weights and Measures【dp】qi

    题意:uva 10154 - Weights and Measures 题意:有一些乌龟有一定的体重和力量,求摞起来的最大高度.力量必须承受其上面包含自己的所有的重量. 分析:先按其能举起来的力量从小 ...

  3. 下载8000首儿歌的python代码

    下载8000首儿歌的python的代码: #-*- coding: UTF-8 -*- from pyquery import PyQuery as py from lxml import etree ...

  4. Hbase总结（五）-hbase常识及habse适合什么场景

    当我们对于数据结构字段不够确定或杂乱无章非常难按一个概念去进行抽取的数据适合用使用什么数据库?答案是什么,假设我们使用的传统数据库,肯定留有多余的字段.10个不行,20个,可是这个严重影响了质量. 而 ...

  5. leetcode 题解 || Valid Parentheses 问题

    problem: Given a string containing just the characters '(', ')', '{', '}', '[' and ']', determine if ...

  6. 在使用SQLServer时忘记sa账号密码解决办法

    先以windows 身份验证方式登录SQLServer数据库,如下图所示: 打开查询分析器,运行如下代码: sp_password Null,'新密码','sa' 即可把原来的密码修改成新密码 例如: ...

  7. xamarin 断点 不命中

    Async Debugging Breakpoints not being hit breakpoint in Android library project not hit when disable ...

  8. ASP.NET Web API实践系列02,在MVC4下的一个实例, 包含EF Code First,依赖注入, Bootstrap等

    本篇体验在MVC4下,实现一个对Book信息的管理,包括增删查等,用到了EF Code First, 使用Unity进行依赖注入,前端使用Bootstrap美化.先上最终效果: →创建一个MVC4项目 ...

  9. Android基础笔记（九）- 广播

    广播的概念 广播的生命周期 案例-监听短信到来并解析短信内容 案例-拦截外拨电话并设置区号 案例-SD卡状态监听 介绍一些经常使用的广播 发送自己定义广播 有序广播和无序广播 启程!! ! 广播的概念 ...

  10. [LNU.Machine Learning.Question.1]梯度下降方法的一些理解

    曾经学习machine learning,在regression这一节,对求解最优化问题的梯度下降方法,理解总是处于字面意义上的生吞活剥. 对梯度的概念感觉费解?到底是标量还是矢量?为什么沿着负梯度方 ...