                        课程
                    
                        /前端开发
                        
                            /Html5
                        
                        /炫丽的倒计时效果Canvas绘图与动画基础

窗口最小化后再打开,小球抱团是为什么?

不知道是什么原因

fdsgasgg

2016-11-02

源自：炫丽的倒计时效果Canvas绘图与动画基础 5-7

关注问题我要回答

927

操作

收起

2 回答

小r
2017-01-04

把原来的setInterval替换成下面的代码，利用焦点处理，算是从源头解决的一个方案。

var intervalId = setInterval(    //每秒执行30次（粗略的）
   function(){
       render( context );
       update();
   }
   ,
   30
);

//获得焦点
window.onfocus = function(){
   intervalId = setInterval(    //每秒执行30次（粗略的）
       function(){
           render( context );
           update();
       }
       ,
       30
   );
};

//失去焦点
window.onblur = function(){
   clearInterval(intervalId);
}

1 回复有任何疑惑可以回复我~

收起回答

qq_孤单求陪同_0

完美解决，我最开始的想法是当页面得到焦点的时候直接刷新页面，设想最好的解决办法就是暂停动画。大神这个代码完美解决问题。那我还有一个问题想要请教，如何在页面改变大小的时候直接史诗改变Canvas大小，而不需要刷新页面之后才改变大小，我用onresize监听的事件，也是用刷新页面这个土方法完成的。不知道大神能不能给个完美的解决办法。