⌘K

Xüsusiyyət transition-duration

Xüsusiyyət transition-duration transition hamar keçidinin icra müddətini təyin edir.

Sintaksis

cssselektor {
  transition-duration: zaman s və ya ms ile;
}

Dəyərlər

Dəyər Açıqlama
s Zamanı saniyələrle təyin edir (məsələn 3s). Kəsr dəyərlər də təyin etmək olar, məsələn, 0.5s - yarım saniyə.
ms Zamanı millisaniyələrle təyin edir (məsələn 3ms). Bir saniyə 1000 millisaniyədir.

Susmaya görə dəyər: 0s.

Nümunə

Kursoru blokun üzerine gətirin - o 2 saniyə ərzində eni hamar şəkildə dəyişəcək. 

html<div id="elem"></div>
css#elem {
  transition-duration: 2s;
  transition-property: width;
  border: 1px solid black;
  height: 50px;
  width: 100px;
}
#elem:hover {
  width: 400px;
}

Результат:

Həmçinin bax

  • xüsusiyyət transition-property,
    hansı ki, hamar keçid üçün xüsusiyyət adını təyin edir
  • xüsusiyyət transition-delay,
    hansı ki, hamar keçiddən əvvəl gecikməni təyin edir
  • xüsusiyyət transition-timing-function,
    hansı ki, hamar keçid üçün zaman funksiyasını təyin edir
  • xüsusiyyət transition,
    hansı ki, hamar keçid üçün qısaldılmış yazılışdır
  • xüsusiyyət animation,
    hansı ki, animasiya yaratmaq üçün istifadə edilir
BackPsevdoelement first-lineNextXususiyyat transition-delay