Suwaki

Nowsze wersje Internet Explorera i Opery interpretują definicję kolorów suwaków (scrollbar), pojawiających się w oknie przeglądarki, gdy dokument jest dłuższy lub szerszy niż okno. Domyślny wygląd suwaków zależy od schematu kolorów przyjętego przez użytkownika w jego systemie. Definiowanie kolorów suwaków pozwalają zastosować kolorystykę odpowiadającą np. dominującym kolorom strony.

Uwaga: suwaki są rozszerzeniem niestandardowym, nieobecnym w specyfikacji stylów, i działają jedynie w obecności deklaracji DOCTYPE Transitional lub w ogóle bez deklaracji. Nie zaleca się ich stosowania. Opisujemy je tutaj ze względu na zainteresowanie wielu początkujących webmasterów.

Definicja może dotyczyć wszystkich elementów, w których pojawiają się suwaki. Typowym użyciem jest body, choć może to być np. także iframe, select czy textarea. W tym miejscu zaprezentujemy przykłady dla ciała dokumentu.

Pełna definicja zawiera 7 możliwych części suwaków:

• Scrollbar-Base-Color: kolor powierzchni suwaka i strzałek oraz rynny suwaka
• Scrollbar-Face-Color: kolor powierzchni suwaka i strzałek, a także kolor składowy rynny suwaka
• Scrollbar-Arrow-Color: kolor strzałek
• Scrollbar-Highlight-Color: kolor składowy rynny suwaka
• Scrollbar-Shadow-Color: kolor płytszego cienia
• Scrollbar-Dark-Shadow-Color: kolor głębszego cienia
• Scrollbar-3dLight-Color: kolor zewnętrznego cienia

scrollbar-base-color:blue

scrollbar-face-color:blue

scrollbar-arrow-color:blue

scrollbar-highlight-color:blue

scrollbar-shadow-color:blue

scrollbar-dark-shadow-color:blue

scrollbar-3dlight-color:blue

Sprawne posługiwanie się tymi wartościami wymaga poeksperymentowania - najlepiej nadaje się do tego testowa strona na serwerze Microsoftu, gdzie obiektem jest element TEXTAREA.

Pełna definicja kolorów suwaków może mieć postać:

body { scrollbar-3dlight-color:tan;
scrollbar-arrow-color:#000000;
scrollbar-base-color:black;
scrollbar-dark-shadow-color:#000000;
scrollbar-face-color:#008080;
scrollbar-highlight-color:snow;
scrollbar-shadow-color:lightblue}

W tworzeniu definicji warto się posługiwać np. zestawieniem kolorów w kursie.