Ιδιότητα animation-fill-mode του CSS

Ορισμός και χρήση

animation-fill-mode Η ιδιότητα καθορίζει αν η ανίμασις είναι ορατή πριν ή μετά την αναπαραγωγή.

Σημείωση:Οι τιμές των ιδιοτήτων είναι μια ή περισσότερες λέξεις-κλειδιά τύπου πλήρωσης που διαχωρίζονται με κόμματα.

Για περισσότερες πληροφορίες:

Εκμάθηση CSS3:CSS animation

Εγχειρίδιο αναφοράς HTML DOM:Ιδιότητα animationFillMode

Παράδειγμα

Καθορίζει τον τύπο πλήρωσης για το στοιχείο h1:

h1
  {
  animation-fill-mode: forwards;
  }

Γλώσσα CSS

animation-fill-mode : none | forwards | backwards | both;
Τιμή Περιγραφή
none Δεν αλλάζει τη προεπιλεγμένη συμπεριφορά.
forwards Μετά την ολοκλήρωση της αニμασιών, διατηρείται η τελευταία τιμή της ιδιότητας (καθορισμένη στο τελευταίο κλειδί κύκλου).
backwards Στο διάστημα που καθορίζεται από το animation-delay, εφαρμόζεται η αρχική τιμή της ιδιότητας (καθορισμένη στο πρώτο κλειδί κύκλου) πριν από την εμφάνιση της αニμασιών.
both Και οι δύο τύποι πλήρωσης (προς τα εμπρός και προς τα πίσω) εφαρμόζονται.

Τεχνικά λεπτομέρειες

Προεπιλεγμένη τιμή: none
Εγκατάληψη: no
Έκδοση: CSS3
Γλώσσα γραφής JavaScript: object.style.animationFillMode=none

Υποστήριξη του προγράμματος περιήγησης

Τα αριθμήματα στη τάβλη αναφέρονται στη πρώτη έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως την ιδιότητα.

κατά προτεραιότητα τα -webkit-, -moz- ή -o- πρόθεμα των αριθμών υποδεικνύει τη πρώτη έκδοση που χρησιμοποιεί το πρόθεμα.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
43.0
4.0 -webkit-		 10.0 16.0
5.0 -moz-		 9.0
4.0 -webkit-		 30.0
15.0 -webkit-
12.1
12.0 -o-