Клизачи су једна од оних компоненти корисничког интерфејса које су присутне на скоро свакој страници интернета, али ми (програмери) имамо мало или нимало контроле над њом. Неки прегледачи дају нам могућност да прилагодимо њихов изглед, али за већину прегледача, укључујући Фирефок, то једноставно није могуће.
Дошло је до неких ажурирања и стандардизације у обликовању клизача. Погледајте тренутно стање стилских клизача за најновије, које можете да пренесете на комбинацију.
Ипак, Цхроме и Интернет Екплорер (да) омогућавају нам да дефинишемо прилагођене стилове за клизаче. Међутим, синтакса је ужасно сложена и, наравно, дефинитивно није стандардна. Добродошли у власнички свет. Због тога ћете можда желети мало мешања да бисте лако прилагодили своје траке за померање. Јел тако?
@mixin scrollbars($size, $foreground-color, $background-color: mix($foreground-color, white, 50%)) ( // For Google Chrome &::-webkit-scrollbar ( width: $size; height: $size; ) &::-webkit-scrollbar-thumb ( background: $foreground-color; ) &::-webkit-scrollbar-track ( background: $background-color; ) // For Internet Explorer & ( scrollbar-face-color: $foreground-color; scrollbar-track-color: $background-color; ) )Употреба:
body ( @include scrollbars(10px, pink, red); ) .custom-area ( @include scrollbars(.5em, slategray); )Пример
Погледајте комбинацију Пен Сасс за стил клизача, Хуго Гираудел (@ХугоГираудел) на ЦодеПен.
Иде даље
У оба прегледача постоји много више опција него само боја и величина. Међутим, често се превиде, па мислим да не вреди претрпати мешавину овим опцијама. Слободно направите напреднији микс са додатним опцијама.
Даља читања:
- Уметнути и прилагођени клизач за ВебКит
- Прилагођене клизаче у Вебкиту
- Прилагођене траке за померање за ИЕ и Цхроме помоћу ЦСС-а