问题

Question

问题

有什么方法，可能是硬件加速，或WebGL，或任何，我能做些什么来加快iPhone的触控反应速度？我真的希望这种反应能够立即出现。

我的问题

我注意到我的菜单花了将近一秒钟的时间来响应它在iPhone 6上点击的图标，而菜单立即响应桌面上的点击。我注意到我访问过的所有移动网站似乎都是这种情况，并且~1s延迟真的很麻烦，它从网络应用程序中消除了那种清晰，反应的感觉。另一方面，在iOS上安装的应用程序立即对触摸作出反应，因此我知道它不是触摸检测速度。

实施例

我创建了一个示例来测试它：

＆＃13;

var size = 'norm';
var $box = $('#box').on('click', function () {
    if (size == 'norm') {
        $box.css({
            'width' : '1in',
            'height' : '1in'
        });
        size = 'big';
    } else {
        $box.css({
            'width' : '',
            'height' : ''
        });
        size = 'norm';
    }
});

＆＃13;

#box {
    width:0.5in;
    height:0.5in;
    margin:0.5in;
    background-color:violet;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="box"></div>

＆＃13;

点击iPhone上的框，您就会明白我的意思。

我尝试了什么

我尝试将-webkit-transform: translateZ(0);插入到项目的样式中以激活硬件加速，但这似乎并没有提高速度。

Answer 1

使用轻量级插件消除点击延迟，例如fastClick https://github.com/ftlabs/fastclick

Answer 2

您遇到的是移动浏览器中的故意延迟，以区分触摸和滑动。这是一个记录良好的问题，幸运的是，有很多可供选择的解决方法：

FastClick是一个插件库，旨在跨多个设备和浏览器删除此问题。
Mobile Chrome有办法关闭延迟。 Firefox有一个类似的方法，IE有一个CSS标志。
您可以注册touchstart活动，而不是click活动。

Telerik has a fairly recent article regarding your options了解移动浏览器的当前状态（2015年）。

我可以避免iPhone 6网页上的反应延迟（接近1秒）吗？

问题

我的问题

实施例

我尝试了什么

2 个答案: