webkit浏览器会把所有需要动画的元素放到复合层中渲染，另外以下两种情况也会使不需要动画的元素也放到复合层中渲染，这样会导致元素动画不流畅(原则是需要的动画才让它在复合层中渲染)

1,元素有一个包含复合层的后代节点||元素有一个在复合层中渲染的后代节点(换句话说，就是一个元素拥有一个子元素，该子元素在自己的层里)

2,元素有一个 z-index 较低且包含一个复合层的兄弟元素(换句话说就是该元素在复合层上面渲染)

当一个元素需要使用动画的时候，通常会使它的兄弟元素也在复合层中渲染，这会导致动画效果很不流畅，解决办法是提升该元素的层级z-index

CSS3硬件加速需要注意的事项的更多相关文章

  1. css3硬件加速

    你知道我们可以在浏览器中用css开启硬件加速,使GPU (Graphics Processing Unit) 发挥功能,从而提升性能吗? 现在大多数电脑的显卡都支持硬件加速.鉴于此,我们可以发挥GPU ...

  2. 3D硬件加速提升动画性能 与 z-index属性

    目录 1. chrome Layer borders 2. 层创建标准 3. 例子 总结 1. chrome Layer borders <WebKit技术内幕>第二章介绍了网页的结构,其 ...

  3. Minimit Anima – 硬件加速的 CSS3 动画插件

    Minimit Anima 是一个实现 CSS3 Transforms 和 Transitions 动画的 jQuery 插件.基于硬件加速的 CSS3 动画执行更快,而且它有一个类似于 jQuery ...

  4. javascript 手势（swipeLeft,swipeRight）滑动中使用css3动画卡顿，开启硬件加速

    今天,在做一个移动端项目,遇到了css3动画卡顿的现象. 例图: 在手势滑动中(swipeLeft,swipeRight)遇到了动画卡顿的现象,最后使用了css3动画-webkit-transform ...

  5. 使用CSS3开启GPU硬件加速提升网站动画渲染性能

    遇到的问题: 网站本身设计初衷就没有打算支持IE8及以下版本浏览器,并不是因为代码兼容性问题,而是真的不想迁就那些懒得更新自己操作系统和浏览器的用户,毕竟是我自己的网站,所以我说了算!哈哈~ 没有了低 ...

  6. CSS3开启硬件加速

    { transform: translateZ(0); transform: translate3d(0,0,0);}<!-- transform: translateZ(0); transfo ...

  7. GPU硬件加速原理 /转

    现代浏览器大都可以利用GPU来加速页面渲染.每个人都痴迷于60桢每秒的顺滑动画.在GPU的众多特性之中,它可以存储一定数量的纹理(一个矩形的像素点集合)并且高效地操作这些纹理(比如进行特定的移动.缩放 ...

  8. GPU硬件加速

    现代浏览器大都可以利用GPU来加速页面渲染.每个人都痴迷于60桢每秒的顺滑动画.在GPU的众多特性之中,它可以存储一定数量的纹理(一个矩形的像素点集合)并且高效地操作这些纹理(比如进行特定的移动.缩放 ...

  9. 被解放的GPU CSS3动画加速

    概念 图形处理器( Graphics Processing Unit ) 专门用来处理在个人电脑.工作站或游戏机上图像运算工作 显卡的“心脏” 90%以上的新型台式电脑和笔记本型电脑拥有集成图形处理器 ...

随机推荐

  1. 关于Android Force Close 出现的原因 以及解决方法

    一.原因: forceclose,意为强行关闭,当前应用程序发生了冲突. NullPointExection(空指针),IndexOutOfBoundsException(下标越界),就连Androi ...

  2. iOS runtime的理解和应用

    项目中经常会有一些的功能模块用到runtime,最近也在学习它.对于要不要阅读runtime的源码,我觉得仅仅是处理正常的开发,那真的没有必要,只要把常用的一些函数看下和原理理解下就可以了. 但是如果 ...

  3. 【代码笔记】iOS-对iphone手机进行判断的一些函数

    代码: #import "RootViewController.h" //为判断手机的型号 -(NSString*)deviceString添加头文件 #import " ...

  4. Web性能--TCP的构成

    前言:阅读<Web性能权威指南>摘录笔记.在这本书开篇就读到第一句话令人印象深刻: "合格的开发者知道怎么做,而优秀的开发者知道为什么那么做". 内容大纲: 1.因特网 ...

  5. 用于主题检测的临时日志(9ef9ede0-46b6-438d-8fb4-ba6b911a34fa - 3bfe001a-32de-4114-a6b4-4005b770f6d7)

    这是一个未删除的临时日志.请手动删除它.(258a3e7d-420b-4c9f-bba2-e0ee0f0f198b - 3bfe001a-32de-4114-a6b4-4005b770f6d7)

  6. 1.7 基础知识——GP2.6 配置管理(CM)

    摘要: 某某工作产品要进行配置管理,并不意味非要进行很重型的配置管理,根据实际需要采取合适的方式就可以了. 正文: GP2.6 Place designed work products of XXX ...

  7. juqery 实现 防止当前页面重复点击，以减轻服务器压力

    <script> //防止当前页面重复点击,以减轻服务器压力 $(document).ready(function () { var current_url = location.path ...

  8. (视频) 《快速创建网站》3.4 网站改版3分钟搞定 － WordPress主题安装和备份

    本文是<快速创建网站>系列的第8篇,如果你还没有看过之前的内容,建议你点击以下目录中的章节先阅读其他内容再回到本文. 访问本系列目录,请点击:http://devopshub.cn/tag ...

  9. Linux PHP5.3升级PHP5.5.33 (CentOS)

    由于要使用了laravel5.1,php要升级到5.5以上.具体环境是Aliyun Cent OS 7.0.由于阿里的yum源lastest只有5.4,laravel5.1必须php5.5,加了几个网 ...

  10. Oracle BIEE启停脚本

    作为BI的开发人员,经常启停BI服务在所难免,启动的过程又比较长,命令需要不同目录切换,简直烦死人呢, 特意整理了linux中的启动脚本,将以下脚本存成biee.sh,后面的过程就相当简单了, 启动: ...