ফাংশন rotateY

ফাংশন rotateY ত্রিমাত্রিক স্থানে Y অক্ষের সাপেক্ষে ঘূর্ণন নির্দিষ্ট করে। এটি transform বৈশিষ্ট্যের সাথে একত্রে ব্যবহার করা হয়। বৈশিষ্ট্যের মান যেকোনো কোণের এককে নির্দিষ্ট করা হয়। ধনাত্মক মান আমাদের দিকে ঘোরায়, ঋণাত্মক মান - আমাদের থেকে দূরে ঘোরায়। ঘূর্ণন সম্পাদিত হয় transform-origin বৈশিষ্ট্য দ্বারা নির্দিষ্ট বিন্দুর চারপাশে।

সিনট্যাক্স

cssসিলেক্টর {
  transform: rotateY(কোণ);
}

উদাহরণ

এই উদাহরণে, ব্লকটি Y অক্ষ বরাবর 180 ডিগ্রি ঘুরবে হোভার করলে। ঘূর্ণনের মসৃণতার জন্য transition বৈশিষ্ট্য যোগ করা হয়েছে:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 3px solid black;
  width: 100px;
  height: 50px;
  transition: transform 3s linear;
}
#elem:hover {
  transform: rotateY(180deg);
}

Результат:

উদাহরণ

transform-origin বৈশিষ্ট্য ব্যবহার করে ঘূর্ণনের অক্ষ পরিবর্তন করা যাক:

html<div id="elem">lorem ipsum</div>

css#elem {
  border: 3px solid black;
  width: 100px;
  height: 50px;
  transition: transform 3s linear;
  transform-origin: right center;
}
#elem:hover {
  transform: rotateY(180deg);
}

Результат:

আরও দেখুন