» »

Создаем свою полосу прокрутки для сайта

Создаем свою полосу прокрутки для сайта

Давайте разберемся как можно сменить полосу прокрутку на сайте. И сделать ее цветную под свой дизайн и все это делается на CSS. Есть небольшой минус, она только отображаться будет на webkit-браузеров, которым относится Осел, Mozilla Firefox, но на движке Хром отлично будет смотреться. Здесь вы можете выставить свой цвет, также саму полосу, где будет ездить scrollbar.

Здесь сам стиль небольшой и можно его поставить в самый низ CSS и не чего не убирать. Что позволяет для темного дизайн сделать уникальную по цветовой гамме прокрутку, не исключая светлый фон. Так что ползунок можно поставить на любую тематику, где потом происходит его настройка.

Установка:

В админ панель идем в CSS и пропишем стили.

Код
::-webkit-scrollbar-button{width:5px;height:0px} ::-webkit-scrollbar-track {background-color:#ecedee} ::-webkit-scrollbar-thumb {-webkit-border-radius: 0px;border-radius: 0px;background-color:#6dc0c8;} ::-webkit-scrollbar-thumb:hover{background-color:#56999f;} ::-webkit-resizer{width:4px;height:0px} ::-webkit-scrollbar{width: 3px;}

Если разобрать, то здесь за ширину отвечает width: 3px, что уменьшаем или увеличиваем, также и по фону, что можно по стилистику поставить.
02.06.2017 Просмотров: 355 Комментарий: (1)

Поделиться в социальных сетях

Материал разместил

Комментарий: 1
Сопрано
Сопрано 02.06.2017 21:591
0
Да основном webkit-браузеры устанавливают, так что полоса будет видна, хотя это можно сделать под какой то дизайн, так бы не трогал и оставил как есть.
avatar