html - iOS8 Safari -webkit-溢出-滚动 : touch; issue

Question

因此，我们正在为一个在 iOS7 上完美运行 Safari 的客户端构建这个网络应用程序。但是当我们在 iOS8 中检查该应用程序时，它有一些巨大的错误。

• 如果用户打开并关闭侧边栏，<section style="overlay-y: scroll;"></section> 中的内容消失(覆盖部分)。
• 某些按钮因任何原因停止工作。 ( <a href="">Lala</a> )

当我们删除 -webkit-overflow-scrolling: touch;从容器(包含所有内容的 div)开始，一切都像以前一样完美地工作......

有什么想法吗？

Answer 1

我也遇到了同样的问题!到目前为止，我找不到真正的解决方案，但有一个不太理想的解决方法:

假设 #container 有 -webkit-overflow-scrolling: touch 属性集，这个 jQuery 应该可以帮助你:

$('#container').css('-webkit-overflow-scrolling','auto');

或者对于 javascript(未测试):

document.getElementById('container').style.webkitOverflowScrolling = 'auto';

这将禁用页面上的平滑轮盘式滚动。所以这并不理想，但您的页面现在应该可以正确滚动了。

编辑:

一些进一步的研究使我们发现了一种更 hacky 的方法来解决这个问题，同时保持平滑的触摸滚动工作。假设你在 css 的某处有 -webkit-overflow-scrolling: touch ，你可以在你的 JS 中“切换”它。我不确定您使用什么来显示/隐藏菜单，但希望您可以利用它。

function toggleMenu(){
    $('#container').css('-webkit-overflow-scrolling','auto');

    //...Existing code

    setTimeout(function() {
        $('#container').css('-webkit-overflow-scrolling','touch');
    },500);
}

如果没有 setTimeout，这对我不起作用。希望这可以帮助您或其他人。