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

Разбираемся в CSS
Ответить Пред. темаСлед. тема
Anonymous
 Прокрутите адресную строку браузера, прежде чем взаимодействовать с прокручиваемыми областями на мобильном устройстве.

Сообщение Anonymous »

Мне нужна страница с примерно таким макетом:

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

... 

 
... 
... 


... 
Для этого у меня есть настройка в прилагаемом фрагменте кода. Фрагмент работает должным образом в настольном браузере. Панель навигации и нижний колонтитул всегда видны, а прокручиваемые страницы при прокрутке привязываются к следующей странице.
Однако в мобильных браузерах пользовательский опыт наличия статической адресной строки не ощущается прямо мне. В мобильных браузерах я обычно прокручиваю страницу немного вниз, чтобы сначала скрыть верхнюю адресную строку, а затем начинаю читать содержимое страницы. Однако, поскольку большая часть моего веб-сайта представляет собой прокручиваемую область с таким макетом, вы пролистываете страницы карусели вместо того, чтобы прокручивать адресную строку. Адресная строка скрывается только при прокрутке за пределы прокручиваемой области (на панели навигации или в нижнем колонтитуле). Это также происходит, когда вы нажимаете на нижнюю страницу и больше нет прокручиваемого контента.
Можно ли изменить это поведение таким образом, чтобы пользователь сначала прокручивал адресную строку - предоставить пользователям возможность просматривать веб-сайт в полноэкранном режиме - и затем, если они прокрутят дальше, начнут прокручивать страницы карусели?
Я думаю, что это может быть в отличие от ожидаемого поведения прокручиваемых областей, но мне кажется, что для этого конкретного дизайна веб-сайта это более интуитивно понятно, поскольку прокручиваемая область занимает всю страницу, а не небольшой контейнер, который прокручивает некоторые изображения.

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

.carousel {
display: inline-flex;
overflow-x: scroll;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
background: blue;
}

.carousel-vertical {
display: flex;
flex-direction: column;
overflow-y: scroll;
scroll-snap-type: y mandatory;
}

.carousel-item {
box-sizing: content-box;
display: flex;
flex: none;
scroll-snap-align: start;
}

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


Nav


a
b



Footer


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

Подробнее здесь: https://stackoverflow.com/questions/783 ... e-areas-on
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «CSS»