Как убрать дёрганье при обновлении контента, которое возникает при пропадании скролбара?

Question

[DTX]

Вот пример:
https://codepen.io/DTX/pen/weemzr

Думал, меня спасёт overflow: overlay, но оно уже не поддерживается.

Answer 1

[Егор Живагин]

body
  overflow-y: scroll

Вот

Comments

[DTX]

Думал в эту сторону, но как решение выглядит сомнительно.. Держать скролбар, когда он не нужен. Не знаю..

[Егор Живагин]

DTX: это распространённый баг. Решается либо так, либо добавлением правого паддинга в момент без скролла

[DTX]

Егор Живагин: а можно как-нибудь отследить момент без скролла?

[Егор Живагин]

DTX: в вашем случае - когда удаляется класс hide )

[DTX]

Егор Живагин: это пример. на реальном сайте, похоже, оследить не получится

[Егор Живагин]

DTX: да почему?) У вас же не просто так скролл пропадает, срабатывает какое-то событие . В данном случае - клик на кнопку. Затем удаляется класс/происходит какая-то трансформация/... , что и убирает блок и скролл. Как раз в этот момент и должен подставляться класс с padding-ом .

[DTX]

Егор Живагин: так не факт, что после удаления контента скролл исчезнет. На простом сайте может ещё можно что-то придумать, а на сайте средней сложности уже навряд ли. Многое ещё зависит от размера окна, масштабирования и прочего.