Computer >> Máy Tính >  >> Lập trình >> HTML

Thuộc tính sự kiện onmouseup HTML

Thuộc tính sự kiện onmouseup HTML được kích hoạt khi nút chuột được nhả ra khỏi phần tử HTML trong tài liệu HTML.

Cú pháp

Sau đây là cú pháp -

<tagname onmouseup=”script”></tagname>

Hãy để chúng tôi xem một ví dụ về Thuộc tính sự kiện onmouseup HTML−

Ví dụ

<!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 onmouseup Event Attribute Demo</h1>
<div class="circle" onmousedown="mouseDownFn()" onmouseup="mouseUpFn()"></div>
<p>Try to click the above red circle</p>
<script>
   function mouseDownFn() {
      document.querySelector('.circle').style.transform = 'scale(0.5)';
   }
   function mouseUpFn() {
      document.querySelector('.circle').style.transform = 'scale(1.2)';
   }
</script>
</body>
</html>

Đầu ra

Thuộc tính sự kiện onmouseup HTML

Nhấp vào “ đỏ ”Vòng tròn để quan sát cách hoạt động của thuộc tính sự kiện onmouseup.

Thuộc tính sự kiện onmouseup HTML


Thuộc tính sự kiện onmouseup HTML