Цвет фона и прокрутка с помощью резиновой ленты в Mobile Safari ⇐ Html

[Anonymous]

Я создаю веб-страницу в Mobile Safari с фиксированным верхним/нижним колонтитулом и резиновой прокруткой основного содержимого:

Код: Выделить всё

 html,
body {
margin: 0 0;
height: 100%;
width: 100%;
overflow: auto;
}
.header,
.footer {
height: 50px;
position: fixed;
z-index: 100;
width: 100%;
}
.header {
top: 0;
background-color: #44677F;
}
.footer {
bottom: 0;
background-color: #4E3AFF;
}
.container {
height: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
.content {
background-size: 50px 50px;
background-color: #D0FCFF;
background-image: linear-gradient(#9DC9FF 50%, transparent 50%, transparent);
height: 2000px;
}

Код: Выделить всё

Как изменить цвет фона области, видимой во время прокрутки резиновой полосой?
Я хотел бы использовать те же цвета верхнего/нижнего колонтитула, чтобы при прокрутке вверх:


и когда я прокручиваю вниз:


Я знаю, что это возможно измените весь цвет областей прокрутки, установив цвет фона в теле:

Код: Выделить всё

body {
background-color: rebeccapurple;
}

поэтому я попробовал использовать градиент:

Код: Выделить всё

body {
background: linear-gradient(to bottom, #44677F 50%, #4E3AFF 50%);
}

но это не сработало.

Подробнее здесь: https://stackoverflow.com/questions/369 ... ile-safari