码迷,mamicode.com
首页 > 移动开发 > 详细

在Android设备上不支持requestAnimationFrame

时间:2017-05-24 14:45:11      阅读:198      评论:0      收藏:0      [点我收藏+]

标签:roi   font   out   nim   哈哈   移动端   是什么   计时   分享   

之前在移动端遇到的问题---用计时器写动画,会有一段时间后出现闪现的问题,刚开始还以为是计时器的问题,用css3写也同样出现问题。

那么问题又来了,到底是什么原因?有时候直觉还是挺对的,查了一下代码,感觉requestAnimationFrame有点不对劲,开始对它下手,搜罗了一下它的相关资料,还真有问题,安卓手机不兼容,哈哈,问题解决一大半了,那么接下来就是兼容处理了,兼容处理一般都是固定模式写法,没什么好解释的——>直接分享代码(就是这么干脆直接):(function() {

   var lastTime = 0;
    var vendors = [‘webkit‘, ‘moz‘];
    for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
        window.requestAnimationFrame = window[vendors[x] + ‘RequestAnimationFrame‘];
        window.cancelAnimationFrame = window[vendors[x] + ‘CancelAnimationFrame‘] ||    // (重点标注一下:)Webkit中此取消方法的名字变了
                                      window[vendors[x] + ‘CancelRequestAnimationFrame‘];
    }

    if (!window.requestAnimationFrame) {
        window.requestAnimationFrame = function(callback, element) {
            var currTime = new Date().getTime();
            var timeToCall = Math.max(0, 16.7 - (currTime - lastTime));
            var id = window.setTimeout(function() {
                callback(currTime + timeToCall);
            }, timeToCall);
            lastTime = currTime + timeToCall;
            return id;
        };
    }
    if (!window.cancelAnimationFrame) {
        window.cancelAnimationFrame = function(id) {
            clearTimeout(id);
        };
    }
}());

在Android设备上不支持requestAnimationFrame

标签:roi   font   out   nim   哈哈   移动端   是什么   计时   分享   

原文地址:http://www.cnblogs.com/jessiet/p/6898495.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!