Style transformOrigin అంశం

నిర్వహణ మరియు ఉపయోగం

transformOrigin అంశం అంగీకరించడానికి అనుమతిస్తుంది.

2D మార్పు అంశాలు అంశం యొక్క x, y అక్షాలను మార్చవచ్చు. 3D మార్పు అంశాలు అంశం యొక్క z అక్షాన్ని కూడా మార్చవచ్చు.

ప్రకటన:ఈ అంశం అప్రమేయ విలువకు అనుగుణంగా ఉండాలి. transform అంశం కలిసి ఉపయోగించండి.

మరింత సూచనలు:

JavaScript Style ఆబ్జెక్ట్:transform అంశం

CSS సూచనాలు:transform-origin అంశం

ఉదాహరణ

ప్రవర్తన కేంద్రం స్థానాన్ని అంగీకరించండి:

document.getElementById("myDIV").style.transformOrigin = "0 0";

స్వయంగా ప్రయత్నించండి

సంకేతం

transformOrigin అంశాన్ని పొందండి:

object.style.transformOrigin

transformOrigin అంశాన్ని అంగీకరించండి:

object.style.transformOrigin = "x-axis y-axis z-axis|initial|inherit"

అంశం విలువ

విలువ వివరణ
x-axis

ప్రదర్శనను x అక్షంపై స్థానం నిర్వహించడానికి నిర్వహిస్తుంది. సాధ్యమైన విలువలు:

  • left
  • center
  • right
  • length
  • %
y-axis

ప్రదర్శనను y అక్షంపై స్థానం నిర్వహించడానికి నిర్వహిస్తుంది. సాధ్యమైన విలువలు:

  • top
  • center
  • bottom
  • length
  • %
z-axis

ప్రదర్శనను z అక్షంపై స్థానం నిర్వహించడానికి నిర్వహిస్తుంది. సాధ్యమైన విలువలు:

  • length
initial ఈ అంశాన్ని అప్రమేయ విలువకు అంగీకరించండి. చూడండి: initial.
inherit ఈ అంశాన్ని తన ముందస్తు అంశం నుండి పారదర్శకంగా పారదర్శకంగా అంగీకరించండి. చూడండి: inherit.

సాంకేతిక వివరాలు

అప్రమేయ విలువ: 50% 50% 0
వాటిని పొందడం కోసం: స్ట్రింగ్ ఆకారం, దీనివల్ల అంశం యొక్క transform-origin అంశం.
CSS సంస్కరణానికి: CSS3

బ్రౌజర్ మద్దతు

పట్టికలో వివరించబడిన సంఖ్యలు ఈ లక్షణాన్ని పూర్తిగా మద్దతు ఇస్తున్న మొదటి బ్రౌజర్ సంస్కరణను పేర్కొంటాయి.

చ్రోమ్ ఎడ్జ్ ఫైర్‌ఫాక్స్ సఫారీ ఓపెరా
చ్రోమ్ ఎడ్జ్ ఫైర్‌ఫాక్స్ సఫారీ ఓపెరా
36.0 10.0 16.0 9.0 23.0