কম্পিউটার টিউটোরিয়াল

HTML DOM TransitionEvent propertyName প্রপার্টি

HTML DOM TransitionEvent propertyName প্রপার্টি একটি স্ট্রিং রিটার্ন করে যা ট্রানজিশন ইভেন্ট ট্রিগার হওয়ার সময় ব্যবহৃত CSS প্রপার্টির নাম নির্দেশ করে।

সিনট্যাক্স

transitionEvent.propertyName

উদাহরণ

<!DOCTYPE html> <html> <head> <title>TransitionEvent propertyName</title> <style>    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    }    #playArea {       display: inline-block;       border-radius: 50%;       background-color: #DC3545;       width: 50px;       height: 50px;       border: 3px solid #AC3509;       transition: all 1.3s ease;    }    #playArea:hover {       transform:translateX(80px);    } </style> </head> <body>    <form>          <fieldset>          <legend>TransitionEvent-propertyName</legend>          <div id="playArea"></div>          <div id="divDisplay"></div>       </fieldset>    </form> <script>    var divDisplay = document.getElementById("divDisplay");    var playDisplay = document.getElementById("playArea");    function getPropertyName(event) {       divDisplay.textContent = 'CSS Property Used for Transition: '+event.propertyName;    }    playDisplay.addEventListener("transitionend", getPropertyName); </script> </body> </html>

আউটপুট

ডিভ এলিমেন্টে হোভার করার আগে:

HTML DOM TransitionEvent propertyName প্রপার্টি

ডিভ এলিমেন্টে হোভার করার পর:

HTML DOM TransitionEvent propertyName প্রপার্টি

  1. HTML DOM Ol start প্রপার্টি

  2. HTML DOM Ol reversed প্রপার্টি

  3. HTML DOM offsetWidth প্রপার্টি

  4. HTML DOM TransitionEvent elapsedTime প্রপার্টি