কম্পিউটার

HTML অন মাউসওভার ইভেন্ট অ্যাট্রিবিউট


HTML অন মাউসওভার ইভেন্ট অ্যাট্রিবিউটটি ট্রিগার হয় যখন মাউস পয়েন্টার একটি HTML নথিতে একটি HTML উপাদানের উপর চলে যায়।

সিনট্যাক্স

নিচের সিনট্যাক্স −

<tagname onmouseover=”script”></tagname>

আসুন HTML onmouseover ইভেন্ট অ্যাট্রিবিউট−

এর একটি উদাহরণ দেখি

উদাহরণ

<!DOCTYPE html>
<html>
<head>
<style>
   body {
      color: #000;
      height: 100vh;
      background-color: #FBAB7E;
      background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%);
      text-align: center;
   }
   .circle {
      background: #db133a;
      height: 150px;
      width: 150px;
      border-radius: 50%;
      margin: 10px auto;
   }
   p {
      margin: 30px auto;
   }
</style>
</head>
<body>
<h1>HTML onmouseover Event Attribute Demo</h1>
<div class="circle" onmousemove="mouseMoveFn()" onmouseout="mouseOutFn()"></div>
<p>Try to move the cursor over the red circle</p>
<script>
   function mouseMoveFn() {
      document.querySelector('.circle').style.background = '#2274A5';
   }
   function mouseOutFn() {
      document.querySelector('.circle').style.background = '#0B6E4F';
   }
</script>
</body>
</html>

আউটপুট

HTML অন মাউসওভার ইভেন্ট অ্যাট্রিবিউট

এখন onmouseout ইভেন্ট অ্যাট্রিবিউট কিভাবে কাজ করে তা দেখতে লাল বৃত্তের উপর মাউস কার্সার নিয়ে যাওয়ার চেষ্টা করুন---

HTML অন মাউসওভার ইভেন্ট অ্যাট্রিবিউট


HTML অন মাউসওভার ইভেন্ট অ্যাট্রিবিউট


  1. HTML অন মাউসআউট ইভেন্ট অ্যাট্রিবিউট

  2. HTML অন মাউস ইভেন্ট অ্যাট্রিবিউট সরান

  3. HTML অন মাউসডাউন ইভেন্ট অ্যাট্রিবিউট

  4. HTML অন মাউসআপ ইভেন্ট অ্যাট্রিবিউট