Удалить полосы прокрутки HTML, но разрешить прокрутку колесика мыши

Question

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

Мне удалось отключить вертикальные полосы прокрутки в сетке, установив свойство CSS overflow-y: hidden, Тем не менее, это убрало возможность прокручивать содержимое с помощью колесика мыши.

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

Answer 1

Есть методы Javascript, смотрите ветку, которую вы продублировали.

Лучшее решение - установить для целевого элемента div значение overflow: scroll и обернуть его во второй элемент, который на 8px уже, который переполняется: скрытый.

Целевой элемент будет иметь скрытую полосу прокрутки. Колесо мыши будет работать, но полоса прокрутки не будет отображаться.

<div style='overflow:hidden; width:200px;'>
   <div style='overflow:scroll; width:208px'>
      My mousewheel scrollable content here....
   </div>
</div>

Обратите внимание, что 8px в качестве ширины полосы прокрутки - это случайное число - это, вероятно, намного больше, и это может потребоваться для каждого браузера CSS.

Все еще лучше, чем JS в моей книге.

Answer 2

Вы можете использовать jScrollPane, который позволяет заменить полосы прокрутки браузера на пользовательские:

Поскольку вы можете стилизовать эти пользовательские полосы прокрутки с помощью CSS, вы можете легко заставить их исчезнуть (попробуйте что-то вроде: .jScrollPaneTrack { display: none; })