Animacja CSS

W pliku circle.html dany jest okrąg.

Ćwiczenie 9.5:

  1. Zrób, aby po kliknięciu na okręgu jego średnica w ciągu 3 sekund płynnie powiększyła się do 300 pikseli.
  2. Po ukończeniu animacji (nie wcześniej, bo się nie zmieści) pośrodku okręgu ma pojawić się napis „Lasto beth lammen”, pogrubiony, rozmiaru 24 pikseli.
  3. Rysunek 9.1 przedstawia wynik końcowy animacji

    Rysunek 9.1. Końcowy wynik animacji

    Końcowy wynik animacji

    Zwróć uwagę na właściwości transitionProperty, transitionDuration elementów DOM. Oraz na zdarzenie transitionend