CSS transition-duration ਪ੍ਰਾਪਰਟੀ

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

transition-duration ਪ੍ਰਤੀਭਾਵ ਟ੍ਰਾਂਜ਼ੀਸ਼ਨ ਪ੍ਰਭਾਵ ਮੁਕੰਮਲ ਹੋਣ ਲਈ ਲਗਾਉਣ ਵਾਲਾ ਸਮਾਂ (ਸੈਕੰਡ ਜਾਂ ਮਿਲੀਸੈਕੰਡ) ਦੱਸੇ।

ਹੋਰ ਦੇਖੋ:

CSS ਸਿੱਖਿਆ:CSS ਟ੍ਰਾਂਜ਼ੀਸ਼ਨ

HTML DOM ਸੂਚਨਾ ਕਿਤਾਬ:transitionDuration ਪ੍ਰਤੀਭਾਵ

ਉਦਾਹਰਣ

5 ਸੈਕੰਡ ਲਈ ਟ੍ਰਾਂਜ਼ੀਸ਼ਨ ਨੂੰ ਚਲਾਓ:

div {
  transition-duration: 5s;
}

ਆਪਣੇ ਆਪ ਦੋਹਰਾਓ

CSS ਗਰੰਟਾਂ:

transition-duration: time;

ਪ੍ਰਤੀਭਾਵ

ਮੁੱਲ ਵਰਣਨ
time

ਟ੍ਰਾਂਜ਼ੀਸ਼ਨ ਪ੍ਰਭਾਵ ਮੁਕੰਮਲ ਹੋਣ ਲਈ ਲਗਾਉਣ ਵਾਲਾ ਸਮਾਂ (ਸੈਕੰਡ ਜਾਂ ਮਿਲੀਸੈਕੰਡ) ਦੱਸੇ।

ਮੂਲ ਮੁੱਲ 0 ਹੈ ਮਤਲਬ ਕੋਈ ਪ੍ਰਭਾਵ ਨਹੀਂ ਹੋਵੇਗਾ。

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਮੂਲ ਮੁੱਲ: 0
ਵਿਰਾਸਤੀਕਰਣ: no
ਸੰਸਕਰਣ: CSS3
JavaScript ਗਰੰਟਾਂ: object.style.transitionDuration="5s"

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

ਸਾਰੇ ਬਰਾਉਜ਼ਰਾਂ ਵਿੱਚ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਿਤ ਹੋਣ ਵਾਲੇ ਪਹਿਲੇ ਬਰਾਉਜ਼ਰ ਦੇ ਨੰਬਰ ਸਾਰੇ ਤੌਰ 'ਤੇ ਸੂਚੀਬੱਧ ਹਨ。

ਦੇਸ਼ -webkit-、-moz- ਜਾਂ -o- ਨਾਲ ਸਮਾਂ ਦੀ ਸਿਫ਼ਾਰਸ਼ ਦਾ ਪਹਿਲਾ ਵਰਜਨ ਹੈ。

Chrome IE / Edge Firefox Safari Opera
26.0
4.0 -webkit-
10.0 16.0
4.0 -moz-
6.1
3.1 -webkit-
12.1
10.5 -o-