Новый пользовательский интерфейс Google Docs имеет классные серые полосы прокрутки.
Они выглядят как обычные полосы прокрутки в стиле селекторов типа ::-webkit-scrollbar-thumb
. Что приятно и доступно.
Однако я не могу получить кнопки со стрелками (обведенные на скриншоте). Инспектор не показывает соответствующие элементы DOM или какой-либо специальный CSS. Итак, вопрос: как сделаны эти пользовательские полосы прокрутки, включая кнопки со стрелками?
Пожалуйста, просмотрите эту скрипту.
Edit:
Итак, кажется, что в Inspector появляются не все правила CSS.
В частности, вам нужны ::-webkit-scrollbar-button:vertical:decrement
и ::-webkit-scrollbar-button:vertical:increment
, а их эквиваленты horizontal
.
См. новая скрипка (обновлено 27 апреля 2012 г.).