HTML DOM Style backfaceVisibility প্রপার্টি

backfaceVisibility প্রপার্টি ব্যবহার করে নির্দিষ্ট করা হয় যে একটি এলিমেন্টের পিছনের ফেস (back face) ইউজারের מולে থাকার সময় দৃশ্যমান হবে কিনা। এটি শুধুমাত্র ৩D ট্রান্সফর্মের জন্য গুরুত্বপূর্ণ যাতে যখন আপনি এলিমেন্টটি ঘুরাবেন তখন এর পিছনের দিক দেখতে চান কিনা।

সিনট্যাক্স

backfaceVisibility প্রপার্টি সেট করার সিনট্যাক্স:

object.style.backfaceVisibility = "visible|hidden|initial|inherit"

মানসমূহ

উদাহরণ

backfaceVisibility প্রপার্টির একটি উদাহরণ:

<!DOCTYPE html> <html> <head> <style> 
  div { 
    position: relative; 
    height: 80px; 
    width: 80px; 
    background-color: lightgreen; 
    float: left; 
    text-align: center; 
    letter-spacing: 0.8px; 
    margin-bottom:10px; 
  } 
  #one { 
    transform: rotateY(180deg); 
    backface-visibility: visible; 
  } 
  p{ 
    clear:both; 
  } 
</style> 
<script> 
  function visibilityChange(){ 
    document.getElementById("one").style.backfaceVisibility="hidden"; 
    document.getElementById("Sample").innerHTML="The backface visibility is now set to hidden."; 
  } 
</script> 
</head> 
<body> 
<div id="one">Lateral Inversion</div> 
<div>Lateral inversion</div> 
<br> 
<p>Click the below button to change the above div backface visibility value</p> 
<button onclick="visibilityChange()">CHANGE VISIBILITY</button> 
<p id="Sample"></p> 
</body> </html>

আউটপুট

নিচের আউটপুট তৈরি হবে:

CHANGE VISIBILITY বাটনে ক্লিক করলে: