स्टाइल एनीमेशनFillMode गुण

परिभाषा और उपयोग

animationFillMode गुण एनीमेशन ना चलने पर (एनीमेशन अंत के बाद या "देरी" के साथ) एलिमेंट पर लागू करने के लिए शैली को निर्धारित करता है।

डिफ़ॉल्ट रूप से, CSS एनीमेशन "प्ले" पहले कीयूएक्स के पूर्व चल रहे एलिमेंट को प्रभावित नहीं करती, और अंतिम कीयूएक्स पूरा होने के बाद इसे प्रभावित करती रहती है।animationFillMode गुण इस व्यवहार को ओवरराइड कर सकते हैं।

उदाहरण

देखें <div> एलिमेंट के animationFillMode गुण को बदलें:

document.getElementById("myDIV").style.animationFillMode = "forwards";

अपने आप प्रयास करें

व्याकरण

animationFillMode गुण वापसी मान:

ऑब्जेक्ट.style.animationFillMode

animationFillMode गुण सेट करें:

ऑब्जेक्ट.style.animationFillMode = "none|forwards|backwards|both|initial|inherit"

गुण मान

मान वर्णन
none डिफ़ॉल्ट मान। एनीमेशन के पूर्व या पश्चात् टारगेट पर कोई शैली लागू नहीं करेगी।
forwards एनीमेशन के अंत के बाद (एनीमेशन-इटरेशन-काउंट द्वारा निर्धारित), एनीमेशन इस गुण मान को एनीमेशन के अंत पर लागू करेगा।
backwards

animation-delay निर्धारित समयावधि के दौरान, एनीमेशन अपनी प्रथम आरंभ दौरान कीयूएक्स में निर्धारित गुण मान लागू करेगा, जो एनीमेशन की पहली प्रतिलिपि को आरंभ करेगा।

ये कीयूएक्स के बिन्दु के मानों से (जब एनीमेशन दिशा "normal" या "alternate" है) या कीयूएक्स के मान से (जब एनीमेशन दिशा "reverse" या "alternate-reverse" है) आते हैं।
both एनीमेशन फ़िल मोड को अग्रेसर और पिछवा नियमों का पालन करेगा। यानी, यह दोनों दिशाओं में एनीमेशन गुण को विस्तार करेगा।
initial इस गुण को इसके डिफ़ॉल्ट मान में सेट करें। देखें initial。
inherit इस गुण को उसके माता एलिमेंट से विरासत करें। देखें inherit。

तकनीकी विवरण

डिफ़ॉल्ट मान: none
वापसी मान: शब्द, जो एलिमेंट के animation-fill-mode विशेषता。
CSS संस्करणः CSS3

ब्राउज़र समर्थन

animationFillMode यह CSS3 (1999) विशेषता है।

सभी ब्राउज़र सम्पूर्णता से इसे समर्थन करते हैंः

च्रोम एज फायरफॉक्स सफारी ओपेरा IE
च्रोम एज फायरफॉक्स सफारी ओपेरा IE
समर्थन समर्थन समर्थन समर्थन समर्थन 11

संबंधित पृष्ठ

CSS संदर्भ हान्डबुकःanimation-fill-mode विशेषता