SO上已经有多个关于溢出/橡皮筋滚动主题的问题，但是它们都没有提供适用于iOS9.3.2上所有情况的解决方案他们都没有提供关于问题本身的广泛而完整的信息这就是我创建这篇文章作为知识体系的原因。问题:在任何其他帖子中从未提及的是iOS溢出滚动实际上是一个两部分行为。1。使用overflow:auto/scroll溢出内容滚动这是具有-webkit-overflow-scrolling:touch的元素的众所周知且最需要的行为连续/动量滚动行为经过元素容器以平滑地减慢滚动内容。当您以足够高的动量滚动元素的内容以使动量滚动超过滚动内容的长度时，就会发生这种情况。有了这种行为，element.
SO上已经有多个关于溢出/橡皮筋滚动主题的问题，但是它们都没有提供适用于iOS9.3.2上所有情况的解决方案他们都没有提供关于问题本身的广泛而完整的信息这就是我创建这篇文章作为知识体系的原因。问题:在任何其他帖子中从未提及的是iOS溢出滚动实际上是一个两部分行为。1。使用overflow:auto/scroll溢出内容滚动这是具有-webkit-overflow-scrolling:touch的元素的众所周知且最需要的行为连续/动量滚动行为经过元素容器以平滑地减慢滚动内容。当您以足够高的动量滚动元素的内容以使动量滚动超过滚动内容的长度时，就会发生这种情况。有了这种行为，element.
问题:在iOS上z-index使用-webkit-overflow-scrolling时忽略可滚动区域的.如果两个对象带有-webkit-overflow-scrollingoverlap下面的那个被滚动，而不是上面显示的那个。如何复现:创建两个相互重叠的元素(例如position:absolute)，其中一个具有更高的z-index并添加.selector{overflow-y:auto;-webkit-overflow-scrolling:touch;}他们两个。两个元素都应该有足够的内容可以滚动。另外添加到您的.然后将该页面添加到您的主屏幕并从那里启动它。如果您随后尝试滚动上方的
问题:在iOS上z-index使用-webkit-overflow-scrolling时忽略可滚动区域的.如果两个对象带有-webkit-overflow-scrollingoverlap下面的那个被滚动，而不是上面显示的那个。如何复现:创建两个相互重叠的元素(例如position:absolute)，其中一个具有更高的z-index并添加.selector{overflow-y:auto;-webkit-overflow-scrolling:touch;}他们两个。两个元素都应该有足够的内容可以滚动。另外添加到您的.然后将该页面添加到您的主屏幕并从那里启动它。如果您随后尝试滚动上方的
我以前一直在使用iScroll插件，但为了原生行为而想放弃它。最初的实现是使用webkit-overflow-scrolling:auto;但是我将其更新为...webkit-overflow-scrolling:touch..在触摸滚动上启用运动/惯性。问题是导航中包含的列表项在滚动时会完全消失，只有在动量停止后才会返回。这方面的一个例子可以是seenhere 最佳答案 我过去遇到过同样的问题，如果您需要使用定位元素，请尝试将-webkit-transform:translateZ(0);添加到元素或容器中。此属性通常会强制浏览器
我以前一直在使用iScroll插件，但为了原生行为而想放弃它。最初的实现是使用webkit-overflow-scrolling:auto;但是我将其更新为...webkit-overflow-scrolling:touch..在触摸滚动上启用运动/惯性。问题是导航中包含的列表项在滚动时会完全消失，只有在动量停止后才会返回。这方面的一个例子可以是seenhere 最佳答案 我过去遇到过同样的问题，如果您需要使用定位元素，请尝试将-webkit-transform:translateZ(0);添加到元素或容器中。此属性通常会强制浏览器
我希望我的网页只能垂直滚动。所以我将overflow-x:hidden;设置为我的.page-wrapper。我的.page-wrapper将两个绝对定位层放在彼此之上。单击按钮时，顶层会滑动到一侧(如position:absolute;所述)并使网站实际上比100%视口(viewport)更宽-因此它可以水平滚动。为了防止水平滚动，我将overflow-x:hidden设置为我的.page-wrapper。如果我这样做，我的正常内容的垂直滚动就会出现错误并且无法正常工作。有什么解决办法吗？更新-webkit-overflow-scrolling:touch;似乎工作正常，只要没有ja
我希望我的网页只能垂直滚动。所以我将overflow-x:hidden;设置为我的.page-wrapper。我的.page-wrapper将两个绝对定位层放在彼此之上。单击按钮时，顶层会滑动到一侧(如position:absolute;所述)并使网站实际上比100%视口(viewport)更宽-因此它可以水平滚动。为了防止水平滚动，我将overflow-x:hidden设置为我的.page-wrapper。如果我这样做，我的正常内容的垂直滚动就会出现错误并且无法正常工作。有什么解决办法吗？更新-webkit-overflow-scrolling:touch;似乎工作正常，只要没有ja
使用可滚动的div.scrollable-div{overflow-x:scroll;overflow-y:hidden;white-space:nowrap;}DEMO在Android设备上，滑动滚动很流畅，甚至有加速和减速。iPhone上的相同代码，滚动很僵硬。当用户释放触摸时，滚动立即停止。如何让iPhone像Android浏览器一样处理可滚动的div，并提供流畅的加速/减速原生样式滚动？ 最佳答案 通过使用以下专有CSS属性，您可以使用overflow在HTML元素上获得原生样式的滚动:-webkit-溢出滚动:触摸；不过，
使用可滚动的div.scrollable-div{overflow-x:scroll;overflow-y:hidden;white-space:nowrap;}DEMO在Android设备上，滑动滚动很流畅，甚至有加速和减速。iPhone上的相同代码，滚动很僵硬。当用户释放触摸时，滚动立即停止。如何让iPhone像Android浏览器一样处理可滚动的div，并提供流畅的加速/减速原生样式滚动？ 最佳答案 通过使用以下专有CSS属性，您可以使用overflow在HTML元素上获得原生样式的滚动:-webkit-溢出滚动:触摸；不过，
