Ширина полосы прокрутки CSS

Люди, можно ли увеличить ширину полосы прокрутки на элементе <div>, расположенном внутри <body>?

Я не говорю о полосе прокрутки по умолчанию в самом браузере, эта страница работает в полноэкранном режиме, а поскольку полоса прокрутки браузера никогда не появляется, внутренний элемент <div> имеет свою собственную полосу прокрутки.

Ответ 1

Если вы говорите о полосе прокрутки, которая автоматически появляется на div с помощью overflow: scroll (или auto), то нет, это все еще встроенная полоса прокрутки, отображаемая браузером с использованием обычных виджетов ОС, а не что-то такое может быть в стиле (*).

В то время как вы можете заменить его прокси-сервером, сделанным из стилизованных div и JavaScript, как это предложил Мэтт, я бы не рекомендовал его для общего случая. Script -driven полосы прокрутки никогда не ведут себя точно так же, как реальные полосы прокрутки ОС, что приводит к проблемам удобства использования и доступности.

(*: За исключением стилей окраски IE, которые я бы тоже не рекомендовал. Помимо использования только IE, использование их заставляет IE отступать от использования хороших изображений прокрутки от текущей темы Windows до уродливого старого Win95 -style полосы прокрутки.)

Ответ 2

Это можно сделать в браузерах на основе WebKit (таких как Chrome и Safari) только с CSS:

::-webkit-scrollbar {
    width: 2em;
    height: 2em
}
::-webkit-scrollbar-button {
    background: #ccc
}
::-webkit-scrollbar-track-piece {
    background: #888
}
::-webkit-scrollbar-thumb {
    background: #eee
}

Демо: jsfiddle.net/2aHeE

Литература:

Ответ 3

вам может быть интересен jScrollPane JQuery-плагин, он кажется простым в использовании http://jscrollpane.kelvinluck.com/

Ответ 4

Вы можете создать определенную панель инструментов для div

div::-webkit-scrollbar {
width: 12px;
}

div::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
}

см. демонстрацию в jsfiddle.net

Ответ 5

Да.

Если полоса прокрутки не является полосой прокрутки браузера, она будет построена из обычных HTML-элементов (возможно, div и span s) и может быть в стиле (или будет Flash, Java и т.д.) и может быть настроена в соответствии с этими средами).

Специфика зависит от используемой структуры DOM.

Ответ 6

Мой опыт использования CSS для изменения полос прокрутки - нет. Только IE позволит вам сделать это.

Ответ 7

Я не понимаю, почему все так счастливы с этой раздутой jscrollpane, когда там есть более легкие решения, которые намного быстрее при использовании колеса: http://baijs.com/tinyscrollbar/