CSS / Kursory

Kształt {CURSOR}

Jak zmienić kursor (wskaźnik) myszki?

(interpretuje Internet Explorer 4, Netscape 6/Mozilla/Firefox, Opera 7, Chrome)

selektor { cursor: rodzaj }

Selektorem może być praktycznie dowolny znacznik [zobacz: Wstawianie stylów].

Natomiast "rodzaj" odpowiada za kształt, jaki przybierze wskaźnik myszki, po naprowadzeniu go na dany element.

Kursory ogólnego przeznaczenia

auto - automatyczny wybór kształtu kursora (zależy od typu elementu, na który wskazujemy - tryb domyślny)
Przykład:
Wskaż ten tekst myszką
Zauważ, że kształt kursora typu "auto" powinien zmieniać się w zależności od tego, czy wskażesz myszką tekst czy fragment tła znajdującego się pod nim (już bez tekstu).
default - kursor domyślny (strzałka)
Przykład:
Wskaż ten tekst myszką
none - brak kursora (CSS 3) - interpretuje MSIE 9, Firefox 3, Opera, Chrome
Przykład:
Wskaż ten tekst myszką

Odsyłacze i kursory statusu

context-menu - menu kontekstowe, zwykle dostępne po kliknięciu prawym przyciskiem myszki (CSS 3) - interpretuje MSIE 9, Firefox 3
Przykład:
Wskaż ten tekst myszką
help - kursor pomocy
Przykład:
Wskaż ten tekst myszką
pointer - wskaźnik (wskazuje odsyłacz) - nie interpretuje MSIE 4
Przykład:
Wskaż ten tekst myszką
progress - "postęp" - interpretuje MSIE 6, ale nie MSIE 5 (CSS 2.1, ale nie CSS 2)
Przykład:
Wskaż ten tekst myszką
wait - "poczekaj"
Przykład:
Wskaż ten tekst myszką

Kursory wyboru

cell - wskazuje, że komórka (jak w arkuszu kalkulacyjnym) może być zaznaczona (CSS 3) - interpretuje MSIE 9, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
crosshair - krzyżyk
Przykład:
Wskaż ten tekst myszką
text - kursor tekstowy
Przykład:
Wskaż ten tekst myszką
vertical-text - pionowy kursor tekstowy (CSS 3) - interpretuje MSIE 6, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką

Kursory "przeciągnij i upuść"

alias - skrót (CSS 3) - interpretuje MSIE 9, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
copy - kopia (CSS 3) - interpretuje MSIE 9, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
move - "przesuń"
Przykład:
Wskaż ten tekst myszką
no-drop - wskazuje, że przeciągany element nie może zostać upuszczony w tej pozycji (CSS 3) - interpretuje MSIE 6, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
not-allowed - żądana akcja nie zostanie przeprowadzona (CSS 3) - interpretuje MSIE 6, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką

Kursory zmiany rozmiaru i przewijania

n-resize - "północ" (north): w MSIE 5 - strzałka w górę, w MSIE 6 - kursor zmiany rozmiaru pionowego
UWAGA! Kursory z grupy "resize" są odmiennie wyświetlane w MSIE 5, gdzie jest to strzałka zwrócona w odpowiednią stronę, natomiast normalnie - kursor zmiany określonego rozmiaru.
Przykład:
Wskaż ten tekst myszką
ne-resize - "północny wschód" (north-east): w MSIE 5 - strzałka, w MSIE 6 - kursor zmiany rozmiaru
Przykład:
Wskaż ten tekst myszką
e-resize - "wschód" (east): w MSIE 5 - strzałka w prawo, w MSIE 6 - kursor zmiany rozmiaru poziomego
Przykład:
Wskaż ten tekst myszką
se-resize - "południowy wschód" (south-east): w MSIE 5 - strzałka, w MSIE 6 - kursor zmiany rozmiaru
Przykład:
Wskaż ten tekst myszką
s-resize - "południe" (south): w MSIE 5 - strzałka w gół, w MSIE 6 - kursor zmiany rozmiaru pionowego
Przykład:
Wskaż ten tekst myszką
sw-resize - "południowy zachód" (south-west): w MSIE 5 - strzałka, w MSIE 6 - kursor zmiany rozmiaru
Przykład:
Wskaż ten tekst myszką
w-resize - "zachód" (west): w MSIE 5 - strzałka w lewo, w MSIE 6 - kursor zmiany rozmiaru poziomego
Przykład:
Wskaż ten tekst myszką
nw-resize - "północny zachód" (north-west): w MSIE 5 - strzałka, w MSIE 6 - kursor zmiany rozmiaru
Przykład:
Wskaż ten tekst myszką
ns-resize - północ-południe (north-south): (CSS 3) - interpretuje MSIE 9, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
ew-resize - wschód-zachód (east-west): (CSS 3) - interpretuje MSIE 9, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
nesw-resize - północny wschód-południowy zachód (north-east south-west): (CSS 3) - interpretuje MSIE 9, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
nwse-resize - północny zachód-południowy wschód (north-west south-east): (CSS 3) - interpretuje MSIE 9, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
col-resize - pozioma zmiana szerokości kolumny: (CSS 3) - interpretuje MSIE 6, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
row-resize - pionowa zmiana wysokości wiersza: (CSS 3) - interpretuje MSIE 6, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką
all-scroll - przewijanie w dowolnym kierunku: (CSS 3) - interpretuje MSIE 6, Firefox 2, Opera, Chrome
Przykład:
Wskaż ten tekst myszką

Komentarze

Zobacz więcej komentarzy