Как скрыть scrollbar на сайте?

Question

[Владимир]

Вот CSS код:

<style type="text/css">
body {
    overflow-y:hidden;
}
</style>

Он скрывает вертикальный scrollbar, но нельзя использовать прокрутку с помощью колесика мыши. А на мобильной версии не работает прокрутка вообще. Как решить эту проблему?

Answer 1

[WQP]

::-webkit-scrollbar { 
    display: none; 
}

Comments

[Дмитрий Лузанов]

А потом глянуть в мозилу -_-

[Владимир]

Спасибо. Все работает. И еще вопрос. Есть такой код:

::-webkit-scrollbar-button { 
background-image:url(''); 
background-repeat:no-repeat; 
width:6px; 
height:0px 
} 

::-webkit-scrollbar-track { 
background-color:#32312e; 
box-shadow:0px 0px 0px #000 inset; 
} 

::-webkit-scrollbar-thumb { 
-webkit-border-radius: 5px; 
border-radius: 0px; 
background-color:#28a7f0; 
background-image:url('https://yraaa.ru/_pu/24/59610063.png'); 
background-position:center; 
background-repeat:no-repeat; 
} 

::-webkit-resizer{ 
background-image:url(''); 
background-repeat:no-repeat; 
width:7px; 
height:0px 
} 

::-webkit-scrollbar{ 
width: 9px; 
}

Можно ли сделать так, чтобы полоса прокрутки была прозрачная (скрыта), а остался только синий слайдер? Пробовал с помощью rgba и transparent, но ничего не получилось.

Answer 2

[Дмитрий Лузанов]

Например так

Comments

[Владимир]

Кроссплатформенный код?

[Дмитрий Лузанов]

Владимир: кастомизация скроллбара не может быть полностью кроссплатформенной, т.к. оформление оного зависит от ОС, темы ОС, браузера и ещё много чего.
Но этот код сработает в большинстве случаев, т.к. он просто сдвигает контейнер со скроллом чуть правее. Т.е. все зависит от ширины дефолтного скролла.

[Дмитрий Лузанов]

Владимир: UPD

[Владимир]

Predve4niy: Спасибо. Поставил.

[Владимир]

Спасибо. Все работает. И еще вопрос. Есть такой код:

::-webkit-scrollbar-button { 
background-image:url(''); 
background-repeat:no-repeat; 
width:6px; 
height:0px 
} 

::-webkit-scrollbar-track { 
background-color:#32312e; 
box-shadow:0px 0px 0px #000 inset; 
} 

::-webkit-scrollbar-thumb { 
-webkit-border-radius: 5px; 
border-radius: 0px; 
background-color:#28a7f0; 
background-image:url('https://yraaa.ru/_pu/24/59610063.png'); 
background-position:center; 
background-repeat:no-repeat; 
} 

::-webkit-resizer{ 
background-image:url(''); 
background-repeat:no-repeat; 
width:7px; 
height:0px 
} 

::-webkit-scrollbar{ 
width: 9px; 
}

Можно ли сделать так, чтобы полоса прокрутки была прозрачная (скрыта), а остался только синий слайдер? Пробовал с помощью rgba и transparent, но ничего не получилось.

[Дмитрий Лузанов]

Владимир: У меня получилось с помощью прозрачности

[Владимир]

Predve4niy: У меня все ровно белая полоса сбоку. Может полосу прокрутки нужно как-то наложить поверх?