Как сделать полосы прокрутки в браузерах Android

Question

Как использовать overflow-y в браузерах Android, например в Opera Mobile? Если я создаю div со стилем overflow-y, то он не будет работать, как в настольных браузерах.

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

Заранее спасибо,

Answer 1

Сделать два деления:

<div class='parent-of-scroller'>
    <div class='scrollable-item'>
        ... your content ... 
    </div>
</div>

Для внешнего div, установите overflow:hidden для управления положением прокрутки внутреннего div, управляя его margin-top с помощью javascript. Я полагаю, что вы можете использовать сенсорные события для управления позицией прокрутки внутреннего div

Answer 2

Для будущих поколений Opera Mobile 12 / Classic, браузер, который вы пометили в своем вопросе, имеет очень конкретные критерии, которым необходимо следовать, чтобы заставить overflow: scroll или overflow: auto работать:

Одной высоты (или ширины) элемента недостаточно для того, чтобы Opera Mobile 12 переполнила элемент, и он будет расширять элементы, если только он не будет полностью позиционирован с верхним и нижним значениями.Это отстой, но в абсолютном положении Opera Mobile 12 добавляет полосу прокрутки к элементам переполнения, но не поддерживает прокрутку с помощью жестов, а элементы управления полосой прокрутки ненадежны.

Итак, чтобы получить Opera Mobile на на самом деле добавьте полосы прокрутки и переполните div, вам нужно немного изменить пример Кишу:

<style>
#parent-of-scroller {
  position: relative;
  height: [whatever]
}
#scrollable-item {
  position: absolute;
  top: 0px;
  bottom: 0px;
}
</style>

<div class='parent-of-scroller'>
    <div class='scrollable-item'>
        ... your content ... 
    </div>
</div>

Opera ≥9.5 CSS hack _:-o-prefocus, body:last-child .your-selector-here может помочь вам.

Отhttp://barrow.io/overflow-scrolling