फ़ंक्शन translateX

फ़ंक्शन translateX एलिमेंट को एक्स-अक्ष पर स्थानांतरित करता है। यह transform गुण के साथ संयोजन में उपयोग किया जाता है। गुण का मान कोई भी आकार की इकाई हो सकती है। सकारात्मक मान दाईं ओर स्थानांतरित करता है, नकारात्मक - बाईं ओर।

सिंटैक्स

cssसिलेक्टर {
  transform: translateX(स्थानांतरण);
}

उदाहरण

यदि ब्लॉक पर माउस ले जाया जाता है - यह दाईं ओर 30px स्थानांतरित हो जाएगा:

html<div id="elem"></div>
css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: translateX(30px);
}

Результат:

उदाहरण

यदि ब्लॉक पर माउस ले जाया जाता है - यह बाईं ओर 30px स्थानांतरित हो जाएगा:

html<div id="elem"></div>
css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: translateX(-30px);
}

Результат:

यह भी देखें

  • फ़ंक्शन translate,
    जो एक्स और वाई अक्षों पर स्थानांतरण निर्दिष्ट करता है
  • फ़ंक्शन translateY,
    जो वाई-अक्ष पर स्थानांतरण निर्दिष्ट करता है