在移动屏幕上滚动时移动网站动画停止

Question

我正在尝试使用 javascript 为移动网站制作一个简单的视差效果。

当我从我的桌面浏览器中检查时，它工作正常。当我从移动设备检查它并使用触摸滚动时，动画会冻结。松开触摸屏后再次显示。

当我使用触摸屏滚动时，有什么方法可以保持动画？

好吧，当您滚动触摸屏手机时，任何类型的 JS 动画都会冻结。

lft = 0;
setInterval(function(){  
  lft++;
  $('#my-div').css('margin-left',lft+'px');     
},100);

如果有人想现场查看问题，请看这里

http://johnpolacek.github.com/scrollorama/

它在桌面浏览器中显示很棒，但在触摸和滚动时冻结来自移动浏览器的动画。

谢谢

Answer 1

很遗憾，您无法控制移动浏览器选择呈现内容的方式。就像在 IE6 中动画 gif 文件会在滚动期间停止动画一样，我认为移动浏览器旨在在滚动期间停止动画。

话虽如此，我已经使用了一些 Safari 特定的效果，并且在 iPhone 上做了一些令人印象深刻的事情，取得了一定的成功。还有像“PhoneGap”这样的库，允许您为手机编写本机“Web 应用程序”。

除了出于移动性能的明确目的从头开始创建整个动画之外，我看不出有一种方法可以简单地使该脚本正常工作。