Предотвращение прокрутки модального экрана в мобильном сафари

Question

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

CSS-код для этого выглядит следующим образом

{ 
    div { 
    height: 100%; 
    width: 100%; 
    overflow: hidden; 
    } 
} 

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

Answer 1

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

div { 
    height: 100%; 
    width: 100%; 
    /* only the y axis (up down) has scroll and we only want that when the contents go out of bounds so the proper css property and value is to disable all scrolling just use the autoflow prop */ 
    overflow-y: hidden; 
    } 

Answer 2

Try:

div { 
    height: 100%; 
width: 100%; 
overflow: hidden; 
position:fixed; 
}