CSS - переполнение: прокрутка; - Всегда показывать вертикальную полосу прокрутки?

Question

Итак, в настоящее время у меня есть:

#div {
  position: relative;
  height: 510px;
  overflow-y: scroll;
}

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

Я использую Mac, ив Chrome и Safari вертикальная полоса прокрутки будет отображаться только тогда, когда мышь находится над Div, и вы активно прокручиваете.Есть ли способ, чтобы это всегда отображалось?

Answer 1

Просто столкнулся с этой проблемой сам.OSx Lion скрывает полосы прокрутки, когда они не используются, чтобы они казались более «скользкими», но в то же время возникает проблема, к которой вы обратились: люди иногда не могут увидеть, имеет ли div функцию прокрутки или нет.

Исправление: в ваш css входит -

@media(device-width: 768px) and (device-height: 1024px){
    ::-webkit-scrollbar {
        -webkit-appearance: none;
        width: 7px;
    }
    ::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background-color: rgba(0,0,0,.5);
        -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
    }
}

. Источник

Answer 2

Обратите внимание, на iPad Safari, решение NoviceCoding не будет работать, если у вас есть - webkit-overflow-scrolling: touch; где-то в вашем CSS. Решение - либо удалить все вхождения -webkit-overflow-scrolling: touch;, либо поставить -webkit-overflow-scrolling: auto; с Решение NoviceCoding.

Answer 3

Это будет работать с iPad на Safari на iOS 7.1.x из моего тестирования, хотя я не уверен насчет iOS 6, хотя. Тем не менее, он не будет работать на Firefox. Существует плагин jQuery, предназначенный для совместимости с различными браузерами, который называется jScrollPane .

.

Кроме того, здесь есть повторяющаяся запись в Stack Overflow , в которой есть некоторые другие детали.

Answer 4

Это заставит полосы прокрутки всегда отображаться, когда в окнах есть контент, который необходимо прокрутить для доступа, это относится ко всем окнам и всем приложениям на Mac:

Запустите Системные настройки из меню Apple. Нажмите на «Общие» настройки панели Найдите «Показать полосы прокрутки» и выберите радиобокс рядом с «Всегда». По завершении закройте системные настройки