Как сделать полосу прокрутки, которая не меняет ширину страницы? (как на мобильных экранах) - PullRequest
0 голосов
/ 13 апреля 2020

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

Большинство вопросов, которые я нашел об этой топике c, имеют возраст не менее 5 лет и не выполняют то, что я хочу, кроме как-то этот , но это не решило проблему.

1 Ответ

0 голосов
/ 13 апреля 2020
У

мобильных экранов полоса прокрутки отсутствует, как у p c.

, но вы можете изменить ширину и стиль полосы прокрутки следующим образом:

::-webkit-scrollbar {
	background: #333;
}


::-webkit-scrollbar-track {
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgb(0, 0, 0);
}


::-webkit-scrollbar-thumb {
	background: linear-gradient(#a700ff, #00fff7);
	border-radius: 10px;
}

	::-webkit-scrollbar-thumb:hover {
		background: linear-gradient(#a700ff87, #00fff778);
	}


body {
  height: 200vh;
}
<body></body>
...