scrollbar na firefoxa/chrome/edge

Question

Witam, podczas tworzenia strony natknąłem się na problem, a mianowicie nie potrafię zrobić scrollbara dla wszystkich tych przeglądarek jednocześnie, chodzi o to że jak zrobię na chrome to nie działa mi na firefoxie  i edge i tak w kółko, jakieś słowa kluczowe?

Answer 1

Dwa: "odpuść sobie" :P

Ale serio, zrobienie scrolla w sensowny, dostępny sposób i to w dodatku tak, żeby wyglądał tak samo we wszystkich przeglądarkach, jest praktycznie niemożliwe. Na chwilę obecną to jest po prostu implementacja custom scrolla w JS – co częściej nie działa niż działa. Jeśli chodzi o "standardowe" metody, to da się zmienić jedynie kolor scrollbara i szerokość – ale na chwilę obecną prawie nikt tego nie implementuje. Blink i WebKit mają swoje ::-webkit-scrollbar, ale… od lat chcą to usunąć (zostało to udostępnione przez przypadek przy robieniu bodajże iTunes).

A ja osobiście jestem wgl zdania, że scrolla nie powinno się ruszać, bo to już nie jest element strony, a część interfejsu systemu użytkownika. I do tego nie powinniśmy mieć nawet dostępu.

Answer 2

Przykladowy kod

 

<style>

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

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 5px;
}
 
::-webkit-scrollbar-thumb {
  background: black; 
  border-radius: 5px;
}

</style>