फ़ंक्शन rotateZ
फ़ंक्शन rotateZ त्रि-आयामी स्थान में Z अक्ष के सापेक्ष
घूर्णन निर्दिष्ट करता है। इसका उपयोग transform
गुण के साथ संयुक्त रूप से किया जाता है।
गुण का मान कोणों की किसी भी इकाई में होता है। सकारात्मक मान घड़ी की दिशा में घुमाता है,
नकारात्मक - विपरीत दिशा में।
घूर्णन उस बिंदु के चारों ओर किया जाता है जो transform-origin
गुण द्वारा निर्दिष्ट होता है।
वाक्य - विन्यास
चयनकर्ता {
transform: rotateZ(कोण);
}
उदाहरण
इस उदाहरण में, होवर करने पर ब्लॉक Z अक्ष पर 180 डिग्री घूम जाएगा। घूर्णन की सहजता के लिए
transition गुण जोड़ा गया है:
<div id="elem">lorem ipsum</div>
#elem {
border: 3px solid black;
width: 100px;
height: 50px;
transition: transform 3s linear;
}
#elem:hover {
transform: rotateZ(180deg);
}
:
उदाहरण
आइए transform-origin गुण का उपयोग करके
घूर्णन अक्ष बदलें:
<div id="elem">lorem ipsum</div>
#elem {
border: 3px solid black;
width: 100px;
height: 50px;
transition: transform 3s linear;
transform-origin: center bottom;
}
#elem:hover {
transform: rotateZ(180deg);
}
:
