скрыть полосу прокрутки, но сохранить функциональность прокрутки в реакции. js

Question

Я перепробовал все методы для ванили HTML, JS и CSS, но, похоже, он не работает, и когда он не реагирует, например, когда я уменьшаю экран, он скрывается, но если он развернут

Пожалуйста, есть ли возможность решить эту проблему в материале-UI и reactjs

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

Answer 1

Это сработало для меня, я создал внешний CSS файл, такой же, как обычный HTML и CSS, а затем связал его с файлом реакции. Он также кроссплатформенный.

.parentDiv{
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}
.childDiv{
    position: absolute;
    top: 0;
    left: 0;
    bottom: -20px;
    right: -20px; 
    overflow: scroll;
 }

, если это слишком долго для вас, попробуйте этот более короткий метод в вашем файле CSS:

*{
    -ms-overflow-style: none;
}
::-webkit-scrollbar {
    display: none;
}

Answer 2

Согласно spe c, вы можете скрыть полосы прокрутки и сохранить функциональность в некоторых браузерах с помощью этого:

/* Hide scrollbar for Chrome, Safari and Opera */
.example::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE and Edge */
.example {
  -ms-overflow-style: none;
}