स्टाइल एनिमेशनTimingFunction गुण

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

animationTimingFunction एनिमेशन की गति की कर्व निर्धारित करें।

गति की कर्व एनिमेशन को एक सेट ऑफ़ CSS स्टाइल से दूसरे सेट स्टाइल के लिए परिवर्तित करने के लिए समय निर्धारित करती है।

गति की कर्व के उपयोग करती है।

उदाहरण

<div> एलीमेंट के animationTimingFunction गुण को बदलें:

document.getElementById("myDIV").style.animationTimingFunction = "linear";

स्वयं प्रयोग कीजिए

व्याकरण

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

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

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

ऑब्जेक्ट.style.animationTimingFunction = "linear|ease|ease-in|ease-out|cubic-bezier(n, n, n, n)|initial|inherit"

गुण मान

मान वर्णन
रेखीय एनिमेशन की गति से शुरू से अंत तक एकसमान है।
सहज एनिमेशन धीमी रूप से शुरू होती है, फिर तेजी से आगे बढ़ती है और फिर धीमी रूप से समाप्त होती है।
सहज-डिफ़ॉल्ट एनिमेशन धीमी रूप से शुरू होती है।
सहज-शुरू एनिमेशन धीमी रूप से समाप्त होती है।
सहज-अंत एनिमेशन के शुरूआत में और अंत में धीमा शुरू होती है।
cubic-bezier(n, n, n, n)

तीन बेजीयर्स फ़ंक्शन में आपके अपने मान निर्धारित करें।

संभावित मान 0 से 1 के बीच के संख्यात्मक मान हैं।
डिफ़ॉल्ट इस गुण को उसके डिफ़ॉल्ट मान में सेट करें। देखें डिफ़ॉल्ट。
संचारित इस गुण को अपने माता एलीमेंट से संचारित करें। देखें संचारित。

तकनीकी विवरण

डिफ़ॉल्ट मान: सहज
वापसी मान: इंटरनेट पृष्ठ विन्यास (CSS) विशेषता animation-timing-function एट्रिब्यूट。
CSS संस्करण: CSS3

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

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

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

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

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

CSS संदर्भ दस्तावेज़:animation-timing-function एट्रिब्यूट