Скрыть webkit-scrollbar, но показать webkit-scrollbar-thumb в компоненте ng-select Angular, чтобы сделать полосу прокрутки полностью прозрачной - PullRequest
0 голосов
/ 27 мая 2020

в моем компоненте Angular, я использую ng-select , и в нем будет отображаться раскрывающийся список параметров. Итак, для этого я в настоящее время реализовал простое управление полосой прокрутки css, которое будет отображать раскрывающийся список параметров выбора с полосой прокрутки, как на этом рисунке.

Итак, я просто делаю следующее, чтобы сделать фон полосы прокрутки белый, чтобы соответствовать его левой стороне.

::-webkit-scrollbar {
    width: 7px;
    height: 7px;
    background-color: #ffff;
    -webkit-border-radius: 100px;
  }

enter image description here

Однако я хочу иметь возможность визуализировать как это изображение, т.е. в основном Мне нужны наложенные полосы прокрутки, которые располагаются поверх содержимого экрана. Поэтому я хочу сделать полосу прокрутки полностью прозрачной, когда она находится над содержимым страницы. Другими словами, в отличие от обычных полос прокрутки, которые занимают физическое пространство на экране, эти накладываемые полосы прокрутки располагаются поверх содержимого экрана. никто еще не нашел ответа на этот вопрос, поэтому поднимите для моей ситуации приложение Angular с ng-select.

И прочитайте об этом свойстве scrollbar-gutter , но это, похоже, только в Стадия рабочего проекта сейчас . Так есть ли другой способ реализовать то же самое.

enter image description here

...