关于requestanimationframe
首先字面理解,请求动画框架,
用法:
var nextFrame = (function() {
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback) { return setTimeout(callback, 1); };
})();
nextFrame(loop);
loop是动画
例子:
loop:function(){
defaults.origin+=defaults.Vx;
con.style["-webkit-transform"]="translateY("+defaults.origin+"px)"
defaults.origin<=-51?self.noop():nextFrame(self.back) }
它的作用是什么?相当于我不知道浏览器绘制时间,所以我请求浏览器根据它自身绘制时间来执行这个动画,
对比css3优势,一切css3可以表现的,他都可以实现,css3不可以实现的它也可以实现
关于requestanimationframe的更多相关文章
- 动画requestAnimationFrame
前言 在研究canvas的2D pixi.js库的时候,其动画的刷新都用requestAnimationFrame替代了setTimeout 或 setInterval 但是jQuery中还是采用了s ...
- 深入理解定时器系列——被誉为神器的requestAnimationFrame
与setTimeout和setInterval不同,requestAnimationFrame不需要设置时间间隔.这有什么好处呢?为什么requestAnimationFrame被称为神器呢?本文将详 ...
- 我的前端故事----疯狂倒计时(requestAnimationFrame)
很久没有更新博客了...为了双十一准备了不少活动,终于结束了,有时间静静的坐下来总结一下了,在活动中最常用的就是倒计时了,晚上也有很多倒计时的例子了,那么今天带来的是一个新的方法和思路. 既然要介绍新 ...
- 深入理解定时器系列第二篇——被誉为神器的requestAnimationFrame
× 目录 [1]引入 [2]特点 [3]使用[4]兼容[5]应用 前面的话 与setTimeout和setInterval不同,requestAnimationFrame不需要设置时间间隔.这有什么好 ...
- requestAnimationFrame,Web中写动画的另一种选择
HTML5/CSS3时代,我们要在web里做动画选择其实已经很多了: 你可以用CSS3的animattion+keyframes; 你也可以用css3的transition; 你还可以用通过在canv ...
- 大熊君学习html5系列之------requestAnimationFrame(实现动画的另一种方案)
一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...
- requestAnimationFrame与setInterval,setTimeout
自打学习canvas动画以来,都说requestAnimationFrame好,就一直用,也没觉得有什么太过于特殊的地方,直到刚才,在写完前面的"小球碰撞墙壁----干掉误差"之后 ...
- HTML5探秘:用requestAnimationFrame优化Web动画
本文转载自: HTML5探秘:用requestAnimationFrame优化Web动画
- 使用requestAnimationFrame做动画效果二
3月是个好日子,渐渐地开始忙起来了,我做事还是不够细心,加上感冒,没精神,今天差点又出事了,做过的事情还是要检查一遍才行,哎呀. 使用requestAnimationFrame做动画,我做了很久,终于 ...
- 使用requestAnimationFrame做动画效果一
最近学习了requestAnimationFrame,看了张鑫旭直白易懂,但是某些地方语言过于裸露的文章http://www.zhangxinxu.com/wordpress/2013/09/css3 ...
随机推荐
- FMDB数据库使用
创建数据库路径 NSString* docsdir = [NSSearchPathForDirectoriesInDomains( NSDocumentDirectory, NSUserDomainM ...
- leyer不写content参数直接传递给子页面数据
function btnAddClickownfund(){ //获取数据 var actual = $("#actual_capitals").html().trim(); // ...
- attr 和 prop的区别
attr 返回的是字符串 prop 返回的是布尔值
- 前端使用mobx时,变量已经修改了,为什么组件还是没变化,map类型变量,对象类型变量的值获取问题(主要矛盾发生在组件使用时)
前天我在使用一个前端多选框组件时遇到了一个问题,明明对象内的值已经修改了,但是组件显示的还是没有效果改变,以下是当时打出的log,我打印了这个对象的信息 对象内的值已经修改了但是组件还是不能及时更改, ...
- PHP字符转码
最近手里面有一个新的项目,下载的程序用的是 gbk, 可是我需要UTF8的格式,因为只有这个的格式才可以加入百度的MIP项目. 来此学习了解php编码的一些内容,还请多多指教.
- PHP单例模式理解
话不多说,先上代码 <?php class User{ /* * 1.创建一个存放对象的私有化静态变量 * 2.私有化克隆方法 * 3.私有化构造方法 * 4.创建实例化对象的唯一入口 * * ...
- Altium Designer (DXP) 复制粘贴,放器件 出错报异常的原因
安装好Altium Designer (DXP) 09板和2013后,运行后原理图复制粘贴元件或者放心的器件后出现下面异常, 原因是: 1.未启动 Print Spooler服务 2.没有安装任何打印 ...
- STM32 HAL库学习系列第2篇 GPIO配置
GPIO 库函数 基本就是使用以下几个函数 GPIO_PinState HAL_GPIO_ReadPin(GPIO_TypeDef* GPIOx, uint16_t GPIO_Pin); void H ...
- Linux CentOS Python开发环境搭建教程
CentOS安装Python 1.CentOS已经自带安装了2.x版本,先尝试python命令检查已安装的版本.如果你使用rpm.yum或deb命令安装过,请使用相对命令查询. 2.复制安装文件链 ...
- 大二作业——操作系统实验——C语言用双向链表,模拟实现动态分区式存储管理
实验:动态分区式存储管理 实验内容: 编写程序模拟完成动态分区存储管理方式的内存分配和回收.实验具体包括:首先确定内存空闲分配表:然后采用最佳适应算法完成内存空间的分配和回收:最后编写主函数对所做工作 ...