Atrybut transition-property CSS
- poprzednia strona transition-duration
- następna strona transition-timing-function
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ść; }
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- |
- poprzednia strona transition-duration
- następna strona transition-timing-function