Określanie koloru paska przewijania

autor: Patryk 'yarpo' Jar, ostatnia modyfikacja: 2007-10-15

szukaj: scroll pasek przewijania scrollbar

Wszelkie zmiany w zabarwieniu scrollbar-a umieszczamy w opisie sekcji body. Czyli może to być definicja body [<body style="i określamy;">] lub też w osobnym pliku, co ja właśnie tu zastosuję.

Zmiany w pliku 'style.css':

/* otwórz plik 'style.css' który utworzyłeś na poprzedniej lekcji */

BODY {
background-color: #CBD1D3;
text-align: center;
/* to wszystko powinno już tam być */

/* a teraz opis scrollbara */
scrollbar-3dlight-color:silver; // 1
scrollbar-arrow-color:black; // 2
scrollbar-base-color:white; // 3
scrollbar-dark-shadow-color:black; // 4
scrollbar-face-color:white; // 5
scrollbar-highlight-color:silver; // 6
scrollbar-shadow-color:silver // 7
}

TABLE {
margin-left: auto;
margin-right: auto; }

Opis:

* - jeśli nie za bardzo zrozumiesz opisu, to sprobuj na osobnej stronie pozmieniać kolory, wtedy sam zobaczysz co konkretny fragment zmienia. Pamiętaj o usunięciu komentarzy [napisów za '//' i między '/* ...*/'].
1 - Kolor efektu 3d.
2 - Kolor strzałki.
3 - Kolor toru przesuwaka.
4 - Kolor prawego i dolnego skraju.
5 - Kolor całego scrolla.
6 - Kolor lewego i górnego skraju.
7 - Kolor cienia.

Schemat:

scrollbar-właściwość-color: kolor;

Podobnie jak w poprzednim przypadku na stronie nie zmieniło się zbyt wiele - jedynie kolor paska przesuwania, który w tej chwili i tak jest raczej mało widoczny. A w treści strony nie było żadnej zmiany. Ale spokojnie za parę lekcji zobaczysz już pierwsze rezultaty swojej pracy. Jeśli pracujesz na Operze lub FF to nie zobaczysz, gdyż te przeglądarki nie kolorują suwaka.

Prawdopodobnie jak zaczniesz szukać to znajdziesz jeszcze inne właściwości suwaków, ale to są podstawowe, które w zupełności starczają na pełne określenie scrollbara.

Nanastępnej lekcji nauczysz się zmieniać wygląd kursora, więc także niewiele się zmieni w wyglądzie strony. Za to już w kolejnych lekcjach twoja strona będzie, wręcz rewolucyjnie, ulegac zmianom.

Uwaga!!! Niektóre przeglądarki [np. Firefox, Opera] nie pozwalają na zmianę koloru paska przewijania (powodem jest zapewne to, że taka "operacja" nie jest zgodna ze standardem W3C)

Patryk 'yarpo' Jar

szukaj: scroll scroll pasek przewijania scrollbar

Zagadnienia poruszane w tej części kursu:

Chcesz zostać programistą?

Poznaj 6 kroków do efektywnej
nauki programowania!