javascript - 在手机屏幕上滚动时，mobi 网站动画停止

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”这样的库，它允许你为手机编写 native “网络应用程序”。

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