jquery - iOS touchmove 事件 - 改变 backgroundPosition 不流畅

Question

我正在尝试创建简单的视差效果来改变背景位置，但在 iOS Safari 中移动不流畅。背景仅在我松开触摸屏时改变其位置，但在我滚动它时不会。

Javascript:

   $(window).bind('touchmove',function(e){  
        var scrolled = $(window).scrollTop();
        $('#home').css('backgroundPosition', 'center ' + (0-(scrolled*2)) +'px');
    });

它实际上不仅发生在更改 backgroundPosition 上，而且发生在 top 的 div 元素上:

$('#home').css('top', (scrolled*2) +'px');

但同时 margin-top 工作正常，移动流畅。

我做错了什么，我怎样才能让它像鼠标滚轮事件一样在 iOS 上工作？

Answer 1

iOS 浏览器会在滚动或手势发生时卡住 DOM 操作。这无法修复，因为这是浏览器的问题。来自 jQuery Mobile ，它说:

Note that iOS devices freeze DOM manipulation during scroll, queuing them to apply when the scroll finishes.