Atrybut transition-property CSS

Definicja i zastosowanie

Właściwość transition-property określa nazwę CSS-owego atrybutu, który ma być użyty do efektu przejścia. (Efekt przejścia rozpocznie się, gdy zmieni się podany CSS-atrybut).

Wskazówka:Efekt przejścia zwykle występuje, gdy użytkownik przenosi kursor myszy nad elementem.

Komentarz:Zawsze ustawiaj transition-duration Jeśli nie ustawiono atrybutu, efekt przejścia nie będzie miał długości czasu i nie zostanie wywołany.

Zobacz również:

Kurs CSS:Przejścia CSS

Podręcznik HTML DOM:Właściwość transitionProperty

Przykład

Umieść kursor myszy nad elementem div, aby uzyskać efekt przejścia z płynną zmianą szerokości elementu:

div {
  transition-property: szerokość;
}

Spróbuj sam

Gramatyka CSS

transition-property: none|all|property;

Wartość atrybutu

Wartość Opis
none Żaden atrybut nie będzie miał efektu przejścia.
wszystkie Wszystkie atrybuty będą miały efekt przejścia.
property Lista nazw CSS-owych atrybutów, które mają być używane do efektu przejścia, oddzielonych przecinkami.

Szczegóły techniczne

Domyślna wartość: wszystkie
Inherencja: nie
Wersja: CSS3
Gramatyka JavaScript: obiekt.style.transitionProperty="szerokość, wysokość"

Obsługa przeglądarek

Liczby w tabeli podają pierwszą wersję przeglądarki, która w pełni obsługuje właściwość.

Liczby z -webkit-, -moz- lub -o- oznaczają używaną pierwszą wersję z przedrostkiem.

Chrome IE / Edge Firefox Safari Opera
26.0
4.0 -webkit-
10.0 16.0
4.0 -moz-
6.1
3.1 -webkit-
12.1
10.5 -o-