2016-02-04 12 views
6

jestem generowanie listy organizacji po lewej stronie tej strony: http://www.ihhub.org/member-map/przelewowy-y: Przewijanie nie wykazujące pasek przewijania w Chrome

Ta lista jest generowany poprzez dodanie <span> znaczniki, które są powiązane z odpowiednią mapą.

Mój problem to - pasek przewijania nie pojawia się w CHROME, ale pojawia się w przeglądarkach Firefox i Safari.

Jakieś rozwiązania?

UPDATE:

Kwestia ta wydaje się być izolowane do MAC OS.

ROZWIĄZANIE:

::-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); 
} 
+0

Jakie masz inne zasady "przepełnienia"? Niektóre przeglądarki nie odtwarzają się dobrze, gdy ustawisz 'overflow-x' wzdłuż' overflow-y' – putvande

+0

Pojawia się na opublikowanym łączu. Testowane na chrome 48 win7 –

Odpowiedz

10

Według CSS - Overflow: Scroll; - Always show vertical scroll bar?: OSX Lion ukrywa paski przewijania, gdy nie są używane do sprawiają, że wydają się bardziej "śliska" ale w tym samym czasie pojawia się problem, na który się zwracasz: ludzie czasami nie widzą, czy element div ma funkcję przewijania, czy nie.

CSS fix:

::-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); 
} 
2

widzę paska przewijania dobrze. Jeśli używasz komputera Mac, może chcesz się upewnić, że paski przewijania są zawsze pokazane

System preferences >> general

+0

Cześć Timo - niestety pasek przewijania nie pojawia się na liście organizacji po zmianie ustawień mac. Ponadto - uważam - jest to problem w Chrome na Maca i Windows. –

+0

Używam chrome na windows i działa – Timo

+0

Świetne Timo - wygląda na to, że to tylko Mac, który nie pojawia się automatycznie. Wciąż szukam tego rozwiązania. Zmieniono przepełnienie-y: przewiń do przepełnienia: auto i bez zmian. –

0

Używam Crome Wersja 48.0.2564.97 m

i działa dobrze .. go zmienić to overflow-y: auto na wypadek, gdyby nie było wystarczającej liczby przedmiotów, które nie będą pokazywały przewijania.

enter image description here

+0

Cieszę się, że działa w Chrome - jest to w systemie Windows. Jeśli tak, problem nadal występuje na komputerze Mac. Zmieniłem się na przepełnienie: auto jak na kilka komentarzy. Proszę doradź. –

0

Dodaj to do swojej css

.list::-webkit-scrollbar { 
    -webkit-appearance: scrollbartrack-vertical; 
}  

lub

.list::-webkit-scrollbar { 
    -webkit-appearance: scrollbarthumb-vertical; 
} 
+0

Cześć Timo - wielkie dzięki za wskazanie tego. Niestety to nie było to, czego szukałem, jednak znalazłem rozwiązanie dzięki twojemu selektorowi :: - webkit-scrollbar. –

+0

Czy mógłbyś podzielić się nim? – Timo

+0

Udostępniłem powyższy @Timo i dodałem do linku do strony również. Wielkie dzięki za twój wkład. –

0

Używam systemu Windows 8 oraz Google Chrome w wersji jest 48.0.2564.97. I działa idealnie. Zobacz w obszarze wyróżnionym obrazem.

enter image description here

Powiązane problemy