关于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 ...
随机推荐
- ios宏定义字符串
ios宏定义字符串 #define objcString(str) @""#str"" 使用效果: objcString(字符串)
- iOS为数字键盘增加完成按钮
在输入价格的时候,要求弹出的键盘只能有数字和小数点.弹出的键盘没有完成键,想要退出键盘可以点击退出,但是为了更好的用户体验,在键盘上增加UIToolbar. 设置ToolBar: - (UIToolb ...
- Eclipse部署Web项目,常用操作和常见错误的解决方案
部署Web项目到tomcat 在eclipse中找到Servers项,打开服务器(F3)(建议直接删除服务器,重新建立再设置比较好)1.Servers Locations 中选择Use Tomcat ...
- Vue 源码分析—— 目录结构
一,Vue.js 的源码都是在src 目录下,其目录结构如下. 1.compiler 目录包含Vue.js 所有编译相关的代码.它包括把所有模板解析成ast 语法树, ast 语法树优化等功能. 2. ...
- MySQL学习之路(二)——数据类型和操作数据表
数据类型和操作数据表 2.1 MySQL类型之整型 2.2 MySQL数据类型之浮点型 2.3 日期时间型 DATE 1支持时间:1000年1月1日~9999年12月31日 DATETIME 3 支持 ...
- promise 格式
promise执行过程(test) var arr =new Array() var obj =new Object() let p =new Promise(function(resolve,rej ...
- 关于xib控件变成框框An internal error occurred
前段时间在进行系统适配的时候,由于在两个不同版本的Xcode之间进行了代码运行调试,导致回到老版本继续开发时xib里面所有的控件全部变成了蓝色的框框...真是哔了狗了 报错信息: an interna ...
- Bootstrap源码解读之栅格化篇
本文纯属自己研究所写笔记,如果有错误还请多多指教提出 版心(container) 版心:class名为.container的容器,其版心的宽度在各个屏幕设备下是不一样的值,版心两边就是留白. 各尺寸下 ...
- 动态链接库 —— Dll 基础
1. DLL 的初识 在 windows 中,动态链接库是不可缺少的一部分,windows 应用程序程序接口提供的所有函数都包含在 DLL 中,其中有三个非常重要的系统 DLL 文件,分别为 Kern ...
- 远程查看java虚拟机内存使用情况jconsole
jconsole 查看虚拟机使用情况 1.在远程机的tomcat的catalina.sh中加入配置: JAVA_OPTS="$JAVA_OPTS -Djava.rmi.server.host ...