Прокрутка содержимого на мобильной странице с фиксированным заголовком/нижним колонтитулом

Question

Привет, я создаю мобильную веб-страницу, где мой контент будет прокручиваться, а нижний колонтитул и позиция позиции фиксированы. Могу ли я сделать контент так, чтобы он не прокручивался под верхний или нижний колонтитул, чтобы он просто прокручивался в своем собственном div.

Причина, по которой я хочу сделать это, заключается в том, что у меня будет некоторая непрозрачность на моем верхнем и нижнем колонтитулах, и если контент будет прокручиваться, это просто не выглядит хорошо.

Херес jsfiddle я сделал, чтобы просто показать вам пример свитка

http://jsfiddle.net/VNVqs/

Answer 1

Здесь вы:

http://jsfiddle.net/VNVqs/3/

Я просто удален position: absolute в прокручиваемую часть (обертка и скролл-контент) и добавили в обертку padding, чтобы первый и последний элемент не находился под верхним и нижним колонтитулом.

В принципе, трюк выполняется с помощью position: fixedтолько на верхний и нижний колонтитулы, и пусть остальной части страницы, чтобы просмотреть, как на обычной странице, без использования overflow: auto на определенной фиксированной высоты элемента. Таким образом, единственная проблема заключается в том, что первые строки вашего содержимого всегда будут находиться под фиксированным позиционированным заголовком (и последним под нижним колонтитулом), но вы можете исправить это, применив некоторые дополнения к обертке содержимого, а также высота заголовка (и нижнего колонтитула). Ты понял?