为什么有时候人们用translate来改变位置而不是定位?
translate()是transform的一个值。
改变transform或opacity不会触发浏览器重新布局(reflow)或重绘(repaint),只会触发复合(compositions)(复合是什么,我也不懂,没听说过,有知道的朋友可以在留言区告诉我)。
transform使浏览器为元素创建一个 GPU 图层
translate改变位置时,元素依然会占据其原始空间
而改变绝对定位会触发重新布局,进而触发重绘和复合。
改变绝对定位会使用到 CPU。
因此translate()更高效,可以缩短平滑动画的绘制时间。
为什么有时候人们用translate来改变位置而不是定位?的更多相关文章
- openlayers模仿google地图--地图版权随鹰眼关闭打开而改变位置
额..题目有点长......今天有个群友问我.想实现google地图地图版权随鹰眼关闭状态改变位置的功能.就是这种<ignore_js_op> 打开鹰眼时 地图版权也随着鹰眼位置改变而改 ...
- context.getResourceAsStream获取的是部署在服务器上面的文件位置 而不是我们本地的工程位置 意思是说获取的都是web下面的文件位置
context.getResourceAsStream获取的是部署在服务器上面的文件位置 而不是我们本地的工程位置 意思是说获取的都是web下面的文件位置
- background,position,绝对定位中位置属性的定位规则,cursor
backgorund背景 background-color:red; 背景颜色 background-image:url(路径);背景图片 background-repeat:no-repeat;不重 ...
- 运行时改变控件的大小(点击后立刻ReleaseCapture,然后计算位移,最后发消息改变位置)——最有趣的是TPanel其实也有窗口标题,因此可发HTCAPTION消息
//光标在控件不同位置时的样式 // 由于拐角这点手动精确实在困难 所以用范围 范围+3 这样很容易就找到这一点了 procedure CtrlMouseMove(Ctrl: TWinControl; ...
- 固定div的位置——不随窗口大小改变为改变位置
百度首页示例: 我给二维码,和下面文本固定位置 这时html代码 <div id="bar_code"> <div class="img_put&quo ...
- windows c++如何使窗口动态改变位置
在windows软件中,经常会碰到一个功能:鼠标hover在某个地方时会出现窗口,有时候这个窗口的位置是会动态调整的. 熟悉使用windows API,理解windows中虚拟坐标.工作区坐标.屏幕坐 ...
- Android:图片中叠加文字,支持拖动改变位置
之所以做了这么一个Demo,是由于近期项目中有一个奇葩的需求:用户拍摄照片后,分享到微信的同一时候加入备注,想获取用户在微信的弹出框输入的内容.保存在自己的server上.而其实,这个内容程序是无法获 ...
- react 可拖拽改变位置和大小的弹窗
一 目标 最近,项目上需要一个可以弹出一个可以移动位置和改变大小的窗口,来显示一下对当前页面的一个辅助内容 二 思路 1.之前写过一个antd modal的可移动弹窗但是毕竟不如自己写的更定制化,比如 ...
- BCB中实现拖拽Panel 改变位置和大小的代码
//--------------------------------------------------------------------------- #ifndef Unit1H #define ...
随机推荐
- Openshift 4.4 静态 IP 离线安装系列:准备离线资源
本系列文章描述了离线环境下以 UPI (User Provisioned Infrastructure) 模式安装 Openshift Container Platform (OCP) 4.4.5 的 ...
- 8000字长文让你彻底了解 Java 8 的 Lambda、函数式接口、Stream 用法和原理
我是风筝,公众号「古时的风筝」.一个兼具深度与广度的程序员鼓励师,一个本打算写诗却写起了代码的田园码农! 文章会收录在 JavaNewBee 中,更有 Java 后端知识图谱,从小白到大牛要走的路都在 ...
- multimap遍历与查找
std::multimap<int, std::string> m; m.insert(std::make_pair(0, "w0")); m.insert(std:: ...
- javascript 面向对象学习(三)——this,bind、apply 和 call
this 是 js 里绕不开的话题,也是非常容易混淆的概念,今天试着把它理一理. this 在非严格模式下,总是指向一个对象,在严格模式下可以是任意值,本文仅考虑非严格模式.记住它总是指向一个对象对于 ...
- Python:列表和列表的增删改查
目录 列表 列表的取值 通过下标 切片 用len()取得列表的长度 用下标改变列表中的值 列表连接和列表复制 用 del 语句从列表中删除值 in和not in操作符 多重赋值 列表的方法 查找 增加 ...
- Mariadb 10.14 mysqldump error: 1049
Mariadb 10.14 mysqldump error: 1049 Table of Contents 1. 错误信息 2. 解决方法 1 错误信息 执行表导出: mysqldump -uroot ...
- Java学习笔记4(多线程)
多线程 多个程序块同时运行的现象被称作并发执行.多线程就是指一个应用程序中有多条并发执行的线索,每条线索都被称作一条线程,它们会交替执行,彼此间可以进行通信. 进程:在一个操作系统中,每个独立执行的程 ...
- 解决React Native安装应用到真机(红米3S)报Execution failed for task ':app:installDebug'的错误
报错信息如下: :app:installDebug Installing APK 'app-debug.apk' on 'Redmi 3S - 6.0.1'Unable to install D:\R ...
- 【漏洞三】跨站点脚本(XSS)攻击
[漏洞] 跨站点脚本(XSS)攻击 [原因] 跨站点脚本(也称为xss)是一个漏洞,攻击者可以发送恶意代码(通常在(Javascript的形式)给另一个用户.因为浏览器无法知道脚本是否值得信任,所以它 ...
- gdi和gdi+比较
http://www.360doc.com/content/10/1013/17/1066008_60709410.shtmlhttp://www.360doc.com/content/10/1013 ...