Android: SLICE, батон, режем на куски. Но последний ломает всю хлеборезку. Почему?

Question

[serega danet]

Slice

на Windows все работает верно, благодаря, и помощи местного Вадима.
Смотри на Android . Все куски режутся нормально, выходят за границы, ничего не прыгает.
Направление резки случайное.
Когда идет вертикальный разрез, все нормально, куски режутся, за границы не выходят.
Но последний кусок не пролазит и все ломает.
Хлеборезка расползается и трещит, и тянет за собой всю кухню.

Чтобы поменьше проблем с этими прыжками от слайдеров , они полностью отключены во всех браузерах. С Хрома-121 это стало удобно и просто.

html, body {
    scrollbar-width: none !important; }

Вопрос: что ему надо и как он это делает ?

Comments

[Вадим]

Из-за того, что у Вас там тень от галереи и навигация сделана на position: absolute - overflow: hidden решает проблему, но так же скрывает тень и навигацию точками.

Тут по хорошему нужно переверстать, но как хотфикс можно обойтись overflow:hidden на самом body. Проблему решает и навигцация на месте, но в нормальном проекте я бы так не делал.

[Вадим]

Парочка возможных путей решения:
- рассмотреть уменьшение зоны галереи на мобилках за счет доп отступов сбоку, тогда слайс не будет выходить за экран и не будет создавать горизонтальную прокрутку.
- Уменьшить количество слайсов на мобилках
- Навесить overflow:hidden на sb-slider со значением important чтобы инлайн стили во время смены слайдов не перебивали это значение. Тогда будет обрезаться по списку (наверное выбрал бы это решение как лучшее для мобилок)
- Отказаться в целом от такой анимации смены слайдов в пользу чего-то по проще для мобилок

[serega danet]

Вадим, согласен, одним overflow не обходится. Какая плавающая проблема. Положил везде overflow, помогло. Реально работало и пряталось за экран. Сейчас все по старому. Мобильники капризные.

[serega danet]

Вадим, отключить анимацию ??? Вы што ! И не просите :).
Переключить ее просто - заменить (r)andom , на (h)orizontal.
Но это тоже самое , что задушить песню,
У меня есть еще активный слайдер на примете. Там слайсы за края выходят на 50%. Страшно браться :).

[serega danet]

Вадим, интересно, зачем так программировать это. CSS, зачем он масштабируется , когда его не просят. Это же не относится к responsible design

[serega danet]

Вадим, похоже Яндек.Браузер даже на ПК не поддерживает отключение скролбаров.
Какое все убитое. На чужом движке, и то не могут готовое взять .
Уже поддерживает. Вчера был Хромиум-120, уже 122. Все работает со скролами. Яндекс, извини :)

[serega danet]

Получается, что все пиксели, которые шевелит скрипт, обрезаются за счет того, что они выходят с отрицательные области слева и сверху. A вот сама overflow : hidden особо и не участвует. И если снизу появится информация , то overflow не поможет. , она бездельничает

[serega danet]

.wrapper {
	width: 100%; 		
	position: relative;
	background-color: rgba( 50, 50, 50, 0.0); 
/*	overflow: hidden; */ }

вот так с мобильниками.

[serega danet]

Наверное, все понятно. Я думал что проблема сверху. Переключил мозг — нет, проблема справа.
Я поместил 4 overflow: hidden везде. Осталось определить , какие лишние

[serega danet]

Заметил и другую проблему. Это устойчивость андроида к изменениям. Известно, что он сохраняет текст в полях ввода после перезагрузки. В отличие от Windows. Можно вручную изменить стиль на хостинге, но браузер телефона покажет старую версию. Я даже чистил кеш браузера (без очистки данных, конечно). Похоже, это не помогает.

Answer 1

[serega danet]

Надо больше hidden везле