Style transition అట్రిబ్యూట్
- ముందు పేజీ transformStyle
- తరువాత పేజీ transitionProperty
- 返回上一层 HTML DOM Style ఆబ్జెక్ట్
నిర్వచనం మరియు వినియోగం
transition ఈ లక్షణం నాలుగు ట్రాన్సిషన్ లక్షణాల సరళీకృత లక్షణం ఉంది:
ప్రక్కలు:ఎల్లప్పుడూ నిర్ణయించండి transitionDuration అట్రిబ్యూట్లేకపోతే డిలే సమయం 0 అవుతుంది, ట్రాన్సిషన్ అనిష్టం అవుతుంది.
ఇతర పరిశీలనలు:
CSS పరిశీలన పతికtransition అట్రిబ్యూట్
ఉదాహరణ
డివ్ ఎలమెంట్ పై మౌస్ ఉంచడంద్వారా దాని రూపాన్ని క్రమంగా మార్చుతుంది:
document.getElementById("myDIV").style.transition = "all 2s";
సింటాక్స్
transition అట్రిబ్యూట్ తిరిగి వచ్చే విలువ
ఆబ్జెక్ట్.style.transition
transition అట్రిబ్యూట్ అమర్చుతుంది:
ఆబ్జెక్ట్.style.transition = "ప్రపర్టీ డ్యూరేషన్ టైమింగ్-ఫంక్షన్ డిలే|initial|inherit"
అట్రిబ్యూట్ విలువ
| విలువ | వివరణ |
|---|---|
| transitionProperty | ట్రాన్సిషన్ ప్రభావం ప్రయోగించబడే సిఎస్ఎస్ లక్షణాన్ని నిర్ణయిస్తుంది. |
| transitionDuration | ట్రాన్సిషన్ ప్రభావం పూర్తి అయ్యే సేకండ్లు లేదా మిల్లీసేకంలు నిర్ణయిస్తుంది. |
| transitionTimingFunction | ట్రాన్సిషన్ ప్రభావం వేగం కర్రను నిర్ణయిస్తుంది. |
| transitionDelay | ట్రాన్సిషన్ ప్రభావం ప్రారంభం కావడానికి నిర్ణయిస్తుంది. |
| initial | ఈ లక్షణాన్ని దాని మూల విలువకు అమర్చుతుంది. చూడండి: initial. |
| inherit | ఈ లక్షణాన్ని తన మూల ఎలమెంట్ నుండి పారదర్శకంగా ఉంచుతుంది. చూడండి: inherit. |
సాంకేతిక వివరాలు
| మూల విలువ | all 0 ease 0 |
|---|---|
| తిరిగి వచ్చే విలువ | స్ట్రింగ్ ఇంకా అనునది ప్రతిపాదించబడింది వంటి అంశం transition అట్రిబ్యూట్. |
| CSS వెర్షన్: | CSS3 |
బ్రౌజర్ మద్దతు
ఈ పట్టికలో ఉన్న సంఖ్యలు ఈ లక్షణాన్ని పూర్తిగా మద్దతు ఇస్తున్న బ్రౌజర్ వెర్షన్ను సూచిస్తాయి.
| క్రోమ్ | ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఒపేరా |
|---|---|---|---|---|
| క్రోమ్ | ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఒపేరా |
| 26.0 | 10.0 | 16.0 | 6.1 | 12.1 |
- ముందు పేజీ transformStyle
- తరువాత పేజీ transitionProperty
- 返回上一层 HTML DOM Style ఆబ్జెక్ట్
