API接口

Window对象定义了以下两个接口:

partial interface Window {
long requestAnimationFrame(FrameRequestCallback callback);
void cancelAnimationFrame(long handle);
};

1、执行requestAnimationFrame之后再执行cancelAnimationFrame。

下面代码只会执行一次a:

var id = null;

    function a(time) {
console.log("animation");
id = window.requestAnimationFrame(a);
window.cancelAnimationFrame(id);
} a();

2、在callback外部执行cancelAnimationFrame。 下面代码只会执行一次a

function a(time) {
console.log("animation");
id = window.requestAnimationFrame(a);
} a();
window.cancelAnimationFrame(id);

requestAnimationFrame 与 cancelAnimationFrame的更多相关文章

  1. 关于requestAnimationFrame()和cancelAnimationFrame()与定时器之间的比较

    在渲染页面动画的时候,其实也没有必要用定时器(setInterval),其实requestAnimationFrame()和cancelAnimationFrame()也能达到相应的效果,他是HTML ...

  2. requestAnimationFrame/cancelAnimationFrame——性能更好的js动画实现方式

    用js来实现动画,我们一般是借助setTimeout或setInterval这两个函数,css3动画出来后,我们又可以使用css3来实现动画了,而且性能和流畅度也得到了很大的提升.但是css3动画还是 ...

  3. requestAnimationFrame,Web中写动画的另一种选择

    HTML5/CSS3时代,我们要在web里做动画选择其实已经很多了: 你可以用CSS3的animattion+keyframes; 你也可以用css3的transition; 你还可以用通过在canv ...

  4. 大熊君学习html5系列之------requestAnimationFrame(实现动画的另一种方案)

    一,开篇分析 Hi,大家好!大熊君又和大家见面了,(*^__^*) 嘻嘻……,这系列文章主要是学习Html5相关的知识点,以学习API知识点为入口,由浅入深的引入实例, 让大家一步一步的体会" ...

  5. requestAnimationFrame与setInterval,setTimeout

    自打学习canvas动画以来,都说requestAnimationFrame好,就一直用,也没觉得有什么太过于特殊的地方,直到刚才,在写完前面的"小球碰撞墙壁----干掉误差"之后 ...

  6. requestAnimationFrame

    (function() { var lastTime = 0; var vendors = ['webkit', 'moz']; for(var x = 0; x < vendors.lengt ...

  7. 性能更好的js动画实现方式——requestAnimationFrame

    用js来实现动画,我们一般是借助setTimeout或setInterval这两个函数,css3动画出来后,我们又可以使用css3来实现动画了,而且性能和流畅度也得到了很大的提升.但是css3动画还是 ...

  8. requestAnimationFrame制作动画:旋转风车

    在以往,我们在网页上制作动画效果的时候,如果是用javascript实现,一般都是通过定时器和间隔来实现的,出现HTML5之后,我们还可以用CSS3 的transitions和animations很方 ...

  9. 记一次动画的优化--requestAnimationFrame、webp

    需要写一个类似帧动画的东西,但是每一帧是一张全屏的图,而且量特别大,600都张,而且存在跳帧的问题,只有把速度调的很快还可以看着不跳帧.但是只用谷歌还真正常播放. 其实优化起来两个方面.一个是用req ...

随机推荐

  1. How to make TWebBrowser get focus in Delphi

    How to make TWebBrowser get focus in Delphi   Written by Administrator       Tags: Delphi Twebbrowse ...

  2. LeetCode:N叉树的层次遍历【429】

    LeetCode:N叉树的层次遍历[429] 题目描述 给定一个 N 叉树,返回其节点值的层序遍历. (即从左到右,逐层遍历). 例如,给定一个 3叉树 : 返回其层序遍历: [ [1], [3,2, ...

  3. 怎么理解TCP的面向连接和UDP的无连接(不面向连接)?

    TCP关心分组是否准确送达,甚至仔细到给每个分组编号并收到目的端的确认“我已经收到啦~你继续发~”才继续发送后续的分组,而UDP则不然,它只负责把分组封装好后直接发送到链路上,至于目的端收到与否并不关 ...

  4. Kattis - honey【DP】

    Kattis - honey[DP] 题意 有一只蜜蜂,在它的蜂房当中,蜂房是正六边形的,然后它要出去,但是它只能走N步,第N步的时候要回到起点,给出N, 求方案总数 思路 用DP 因为N == 14 ...

  5. Set,List,Map的区别

    最近在学习struct2中OGNL表达式的过程中,发现自己对set,list,map存在只是欠缺,在百度的过程中发现了此文觉得讲的不错,放到自己博客以便再次查阅,也希望更多地菜鸟看到. java集合的 ...

  6. C/C++中0xcccccccc...

    * 0xABABABAB : Used by Microsoft's HeapAlloc() to mark "no man's land" guard bytes after a ...

  7. 查询当天数据(mysql)

    SELECT count(*) as nums FROM go_member_share WHERE DATEDIFF(FROM_UNIXTIME(time, '%Y-%m-%d') , now()) ...

  8. Mac 使用技巧分享

    1. 快捷键开启speech功能: System Preferences -> Ditaction&Speech ->Text to Speech ->Select 'Spe ...

  9. Spring中Value注解的使用

    Spring中Value注解的使用 分类: Spring2014-08-16 17:28 2985人阅读 评论(0) 收藏 举报 有的时候我们定义了Properties文件,并且使用Spring的Pr ...

  10. Oracle递归查询与常用分析函数

    最近学习oracle的一些知识,发现自己sql还是很薄弱,需要继续学习,现在总结一下哈. (1)oracle递归查询  start with ... connect by prior ,至于是否向上查 ...