iOS7 Safari更改webkit-overflow-scrolling背景颜色

Ade*_*Ade 6 css safari webkit ios7

在适用于iOS7的Cordova iPad应用程序中,我有一个固定高度的DIV(.scrollContainer),我将更高的内容添加到其中,我允许包含的内容像这样滚动:

.scrollContainer
{
    width: 512px;
    height: 546px;
    overflow: hidden;
    overflow-y: scroll !important;
    -webkit-overflow-scrolling: touch;
    background-color: #fff !important;
}

#content
{
    width: 512px;
    background-color: #fff;
}
Run Code Online (Sandbox Code Playgroud)

用户可以在触摸界面中很好地滚动嵌套内容,但是用户也可以按照iOS 7界面滚动"过去"上方或下方内容的结尾(即,当它们放开时它会快速回滚).

过度滚动时显示的背景颜色为黑色.有没有办法使用CSS将其设置为不同的颜色?

小智 14

今天面临同样的问题(iOS 7.1),看起来像是一个小故障或什么的,

添加边框或填充似乎可以修复它,允许您为元素本身设置背景颜色.我用这个技巧把它整理出来:

padding-top:1px;
margin-top:-1px;
Run Code Online (Sandbox Code Playgroud)

另一种解决方案是在.scrollContainer元素上保留背景,并将其设置为其父元素.

  • 此修复工作完美.个人建议选择第二个提到的解决方案:只在非滚动容器上设置背景颜色 - 这样清洁方式.谢谢! (3认同)