Kurs języka HTML i CSS

Poradnik webmastera

  • Zwiększ rozmiar czcionki
  • Domyślny  rozmiar czcionki
  • Zmniejsz rozmiar czcionki
Kurs języka HTML i CSS

CSS3 - animation-duration

Email Drukuj PDF

Tematy: animation | @keyframes | animation-name | animation-duration | animation-timing-function | animation-delay | animation-iteration-count | animation-direction | animation-play-state

Dane w pigułce
Zastosowanie Definiuje czas trwania jednego cyklu animacji
Dziedziczenie nie
Wartości czas w sekundach lub milisekundach
Wartość domyślna 0
Przykład animation-duration: 5000ms;
Składnia JavaScript object.style.animationDuration="5000ms"

Aby zdefiniować czas trwania animacji, należy wpisać w definicji stylu animation-duration: czas.

Żadna z przeglądarek nie obsługuje czystego kodu, Chrome i Safari wymagają prefiksu -webkit-.

Czas trwania możemy podawać w zbiorczej definicji animacji lub też w postaci oddzielnego wiersza kodu.

Dwa obiekty, pierwszy z czasem jednokierunkowego przebiegu animacji 3s, drugim - z czasem 5s:



Interpretacja: Chrome i Safari (z prefiksem).

 

Nowości Helionu

Statystyki

Użytkowników : 3
Artykułów : 484
Zakładki : 28
Odsłon : 6354619