Тело прыгает на x пикселей влево, когда добавлена полоса прокрутки

Question

Тело прыгает на x пикселей влево, когда добавлена полоса прокрутки

0

Когда у вас есть Угловая маршрутизация, эта проблема становится чрезвычайно осознанной и раздражающей. Когда на одной из страниц есть полоса прокрутки, а вторая - нет, переключаясь между ними, вы заметите, что тело смещается справа налево и наоборот наоборот для ширины полосы прокрутки.

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

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

potatopeelings 30 нояб. 2015, в 13:42

Источник

Теги:

javascript

jquery

html

angularjs

css

2 ответа

1

Вы можете заставить вертикальную полосу прокрутки показать, установив overflow-y: scroll

div {
  overflow-y: scroll;

  /* Additional styling for the demo */
  display: inline-block;
  width: 100px;
  height: 100px;
  border: 1px solid black;
}

<div></div>
<div><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/></div>

Cerbrus 30 нояб. 2015, в 10:33

0

Спасибо за ответ, это действительно удобное решение, но есть ли альтернатива тому, что я предложил, не нажимая полосу прокрутки, когда, возможно, в этом нет необходимости?
user5203771 30 нояб. 2015, в 12:33
0

Может быть, но это может быть очень сложно заставить работать должным образом, так как не все устройства / браузеры обрабатывают полосы прокрутки одинаково ... (например, разной ширины)
Cerbrus 30 нояб. 2015, в 12:35

Ещё вопросы

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

potatopeelings · Accepted Answer · 2015-11-30T09-42-00.000Z

Вы можете поместить CSS, чтобы всегда показывать полосу прокрутки (даже если для этого недостаточно контента, чтобы гарантировать ее)

Из https://css-tricks.com/snippets/css/force-vertical-scrollbar/

html {
       overflow-y: scroll;
}