Style animationTimingFunction ਵਿਸ਼ੇਸ਼ਤਾ

ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ

animationTimingFunction ਏਨੀਮੇਸ਼ਨ ਦੀ ਸਪੀਡ ਕ੍ਰਿਮਸ ਨਿਰਧਾਰਿਤ ਕਰੋ。

ਏਨੀਮੇਸ਼ਨ ਦੀ ਸਪੀਡ ਕ੍ਰਿਮਸ ਨਿਰਧਾਰਿਤ ਕਰੋ。

ਸਪੀਡ ਕ੍ਰਿਮਸ ਵਿੱਚ ਸਮੇਂ ਵਿੱਚ ਸਮੇਂ ਵਿੱਚ ਬਦਲਣ ਵਾਲੇ ਕ੍ਰਿਮਸ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹਨ。

ਉਦਾਹਰਣ

ਦੇ <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"

ਵਿਸ਼ੇਸ਼ਤਾ ਮੁੱਲ

ਮੁੱਲ ਵਰਣਨ
linear ਏਨੀਮੇਸ਼ਨ ਦੀ ਸਪੀਡ ਸ਼ੁਰੂ ਤੋਂ ਸਮਾਪਤ ਤੱਕ ਇੱਕ ਸਮਾਨ ਹੁੰਦੀ ਹੈ。
ਸਰਲ ਮੂਲਤਵੀ ਮੁੱਲ। ਏਨੀਮੇਸ਼ਨ ਧੀਰੀ ਤਰ੍ਹਾਂ ਸ਼ੁਰੂ ਕਰਦੀ ਹੈ, ਫਿਰ ਤੇਜ਼ ਹੋ ਜਾਂਦੀ ਹੈ ਅਤੇ ਫਿਰ ਧੀਰੀ ਤਰ੍ਹਾਂ ਸਮਾਪਤ ਹੁੰਦੀ ਹੈ。
ease-in ਏਨੀਮੇਸ਼ਨ ਦੇ ਸ਼ੁਰੂ ਵਿੱਚ ਧੀਰ ਹੁੰਦੀ ਹੈ。
ease-out ਏਨੀਮੇਸ਼ਨ ਦੇ ਸਮਾਪਤ ਵਿੱਚ ਧੀਰ ਹੁੰਦੀ ਹੈ。
ease-in-out ਏਨੀਮੇਸ਼ਨ ਦੇ ਸ਼ੁਰੂ ਅਤੇ ਸਮਾਪਤ ਵਿੱਚ ਧੀਰ ਹੁੰਦੀ ਹੈ。
cubic-bezier(n, n, n, n)

ਤਿੰਨ ਬੇਜਰੂਰੀ ਬੇਸਲ ਫੰਕਸ਼ਨ ਵਿੱਚ ਆਪਣੇ ਮੁੱਲ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰੋ。

ਸੰਭਵ ਮੁੱਲ ਸਿਰਫ 0 ਤੋਂ 1 ਦੇ ਨੰਬਰ ਹੁੰਦੇ ਹਨ।
ਮੂਲਤਵੀ ਮੁੱਲ: ਇਹ ਵਿਸ਼ੇਸ਼ਤਾ ਇਸ ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਇਸ ਵਿਸ਼ੇਸ਼ਤਾ ਦੇ ਮੂਲਤਵੀ ਮੁੱਲ ਤੇ ਰੱਖਦੀ ਹੈ। ਦੇਖੋ ਮੂਲਤਵੀ ਮੁੱਲ:。
ਮਿਲਣਾ ਇਹ ਵਿਸ਼ੇਸ਼ਤਾ ਆਪਣੇ ਮਾਤਾ ਤੱਤ ਤੋਂ ਇਸ ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਮਿਲਣ ਦੇ ਮੁੱਲ ਤੋਂ ਲੈਂਦੀ ਹੈ। ਦੇਖੋ ਮਿਲਣਾ。

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਮੂਲਤਵੀ ਮੁੱਲ: ਸਰਲ
ਰਿਟਰਨ ਵੈਲਿਊ: ਸਟਰਿੰਗ ਜੋ ਕਿ ਤੱਤ ਦਾ animation-timing-function ਵਿਸ਼ੇਸ਼ਤਾ。
CSS ਸੰਸਕਰਣ: CSS3

ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ

animationTimingFunction ਇਹ ਕ੍ਰਿਮਸ (1999) ਵਿਸ਼ੇਸ਼ਤਾ ਹੈ।

ਸਾਰੇ ਬਰਾਉਜ਼ਰ ਇਸ ਨੂੰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਕਰਦੇ ਹਨ:

ਚਰਮੋਨੀ ਐਂਜਲ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ IE
ਚਰਮੋਨੀ ਐਂਜਲ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ IE
ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ ਸਮਰਥਨ 11

ਸਬੰਧਤ ਪੰਨੇ

CSS ਸੰਦਰਭ ਮੁੱਲਾਂ:animation-timing-function ਵਿਸ਼ੇਸ਼ਤਾ