Настройте полосу прокрутки «палка и мяч» для веб-сайта

#java #jquery #css #webkit #scrollbar

Вопрос:

Я пытаюсь настроить полосу прокрутки (для работы во всех браузерах), которая выглядит как изображение ниже. Я связываю это с каруселью изображений, которая стекает с экрана справа.

введите описание изображения здесь

Я нашел аналогичный вопрос о переполнении стека, однако единственный ответ, направленный в пользовательскую загрузочную библиотеку полосы прокрутки. Я хочу закодировать его с нуля.

Я возился с ним, но это моя первая попытка настроить полосу прокрутки, и я не могу понять, как это сделать.

Спасибо

Полоса прокрутки прикрепляется к элементу с помощью этого CSS

     #scroll-carousel {
    display: flex;
    flex-direction: row;
    flex: 1;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
}
 

Комментарии:

1. Пожалуйста, покажите нам код, который у вас есть до сих пор.

2. Я бы начал с проверки руководства по css-трюкам и/или некоторых примеров в codepen , чтобы увидеть, как другие делают это для вдохновения