CSS-Overflow: Scroll ; - Zawsze pokazuj pionowy pasek przewijania?

Więc obecnie mam: 

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

Jednak nie wierzę, że będzie oczywiste dla niektórych użytkowników, że jest tam więcej treści. Mogą przewijać stronę w dół, nie wiedząc, że mój div faktycznie zawiera dużo więcej treści. Używam wysokości 510px tak, że odcina jakiś tekst, więc na niektórych stronach wygląda to tak, że jest więcej treści, ale to nie działa na wszystkich z nich.

Używam Maca, a w Chrome i Safari pionowy pasek przewijania pokaże się tylko wtedy, gdy mysz znajduje się nad Div I aktywnie przewijać. Czy istnieje sposób, aby zawsze go wyświetlać?

Author: Mosh Feu, 2011-09-21
Source

4 answers

Sama wpadłam na ten problem. OSx Lion ukrywa paski przewijania, gdy nie jest używany, aby wydawał się bardziej "gładki", ale jednocześnie pojawia się problem, który rozwiązałeś: ludzie czasami nie widzą, czy div ma funkcję przewijania, czy nie.

Poprawka: w css include - 

@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);
    }
}

Dostosuj wygląd w razie potrzeby. Źródło

 313
Author: NoviceCoding,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-01-27 12:15:32

Zwróć uwagę na iPad Safari, rozwiązanie NoviceCoding nie będzie działać, jeśli masz - webkit-overflow-scrolling: touch; gdzieś w CSS. Rozwiązaniem jest usunięcie wszystkich wystąpień -webkit-overflow-scrolling: touch; lub umieszczenie -webkit-overflow-scrolling: auto; z Rozwiązanie NoviceCoding.

 9
Author: Razan Paul,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-04-24 01:47:56

To będzie działać z iPadem Na Safari na iOS 7.1.x z moich testów, nie jestem jednak pewien iOS 6. Jednak nie będzie działać na Firefoksie. Istnieje wtyczka jQuery, która ma być zgodna z przeglądarkami o nazwie jScrollPane .

Istnieje również duplikat posta tutaj na Stack Overflow, który ma kilka innych szczegółów.

 0
Author: JStarcher,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 12:34:37

Spowoduje to, że paski przewijania będą zawsze wyświetlane, gdy w systemie windows jest zawartość, która musi być przewinięta, aby uzyskać dostęp, dotyczy to WSZYSTKICH windows i wszystkich aplikacji na komputerze Mac:

Uruchom Preferencje systemowe z menu programu Apple Kliknij na panelu ustawień "ogólne" Poszukaj "Pokaż paski przewijania" i wybierz radiobox obok "zawsze" Zamknięcie poza preferencjami systemowymi po zakończeniu

 -4
Author: Michelle,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-03-04 15:54:47