Использование -webkit-overflow-scrolling: touch скрывает содержимое при прокрутке / перетаскивании - PullRequest
Новая
       12

Использование -webkit-overflow-scrolling: touch скрывает содержимое при прокрутке / перетаскивании

14 голосов
/ 21 марта 2012

Как видно из заголовка, у меня проблема со скрытием контента при прокрутке / перетаскивании контента при использовании свойства CSS -webkit-overflow-scrolling: touch.

Для базового понимания, вот моя разметка 

<div class="page">
   <div class="section_title">Title</div>
   <div class="items">
      <div class="item">...Text and Image...</div>
      <div class="item">...Text and Image...</div>
      <div class="item">...Text and Image...</div>
   </div>
   <div class="section_title">Title</div>
   <div class="items">
      <div class="item">...Text and Image...</div>
      <div class="item">...Text and Image...</div>
      <div class="item">...Text and Image...</div>
   </div>
</div>

И CSS: 

.page {
    width: 320px;
    height: 366px;
    overflow: scroll;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

Сам код работает хорошо, я могу прокручивать содержимое, новсе, что находится внутри элемента div, скрыто, пока я прокручиваю / перетаскиваю.Кто-нибудь сталкивался с этой проблемой и решил ее, или это просто стандартное поведение Mobile Safari для экономии памяти, и мы ничего не можем с этим поделать?

Любая помощь приветствуется: -)

Ответы [ 2 ]

32 голосов
/ 31 марта 2012

Вы пытались поместить элементы в память?

Если нет, попробуйте поместить .items в память, используя css -webkit-transform: translate3d(0,0,0);

Возможно, вы захотите подняться выше или ниже в зависимости от производительности, т. Е. Примените перевод к .page или .item. Это увеличит объем используемой памяти, что может привести к сбою, но поможет браузеру перерисовать все.

В любом случае, надеюсь, это поможет!

4 голосов
/ 13 июня 2012

Это, вероятно, связано с ошибкой в ​​webkit.Если у вас есть какая-либо «позиция: относительная» или абсолютная, ваш код должен работать нормально

...