UI2 и waDialog: content shift при вертикальном скролле Исправлено

Форум разработчиков »

$.waDialog блокирует вертикальный скролл присваивая body класс .is-locked, который блокирует вертикальный скролл делая просто "overflow: hidden". Из-за этого браузер убирает полосу прокрутки и контент основной страницы дёргается при открытии и закрытии модалки.

В сети есть множество рекомендаций, как определить есть ли у документа вертикальный скролл и какова его ширина, как из этого сделать отступы или просто заблочить скролл, но показывать скроллбар

4 комментария

+1

tattoo85 22 апреля 2021 13:10 #

Кстати дергание это появилось с недавних пор и на форуме, при написании коментария с мобильного устройства.

ответить

Константин Шевский 28 апреля 2021 20:37 #

Проверенное решение примерно такое :)

const defaultBodyStyle = {
  width: document.body.style.width,
  overflow: document.body.style.overflow,
};

openDialogFn = () => {
  document.body.style.width = 'calc(100% - ' + (window.innerWidth - document.body.clientWidth) + 'px)';
  document.body.style.overflow = 'hidden';
};

closeDialogFn = () => {
  document.body.style.width = defaultBodyStyle.width;
  document.body.style.overflow = defaultBodyStyle.overflow;
};

ответить

+1

Vital Primak 23 июня 2022 00:11 #

Можете подсказать в каком файле код добавить?

ответить

+1

Михаил Ушенин Webasyst 29 апреля 2021 10:29 #

Это исправится при очередном обновлении фреймворка. Спасибо!

ответить

UI2 и waDialog: content shift при вертикальном скролле Исправлено

4 комментария

Добавить комментарий