我在我的一个动画循环中遇到了一个非常神秘的问题。基本上我有一个在PNG蒙版后面运行的动画来创建发光效果。正如预期的那样,动画会无限地运行。但是,不久之后,动画速度减慢并最终停止。
这里是令人费解的部分:没有 png mask (及其中的 div),动画运行流畅。
这是怎么回事?
--这是没有蒙版的页面:http://chrismorga.com/rainnav/closed.html
--带着面具(重新加载并立即观察减速的光芒):http://chrismorga.com/rainnav/open.html
作为引用,这里是 javascript。函数在页面加载后运行:
function StartMove() {
var cssBGImage=new Image();
cssBGImage.src="img/blueshifter.jpg";
window.cssMaxWidth=cssBGImage.width;
window.cssXPos=0;
setInterval("MoveBackGround()",10);
}
function MoveBackGround () {
window.cssXPos=window.cssXPos+1;
if (window.cssXPos>=window.cssMaxWidth) {
window.cssXPos=0;
}
toMove=document.getElementById("scroller");
toMove.style.backgroundPosition=window.cssXPos+"px 0px";
}
...
<body onload="StartMove()">
我的 JavaScript 是否使用了一些不好的做法?此时任何见解都会有所帮助。
最佳答案
-更新-
我纯粹是偶然发现了我的问题。我的手机运行动画效果很好,所以我想,为什么是这个 Chrome 而不是电脑 Chrome ?
事实证明,运行 chrome 19 导致了错误!快速更新,我运行得很好。我想我应该欢迎自己来到最前沿,哈哈。
关于javascript动画因上面的元素而减慢,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11297039/