Javascript DOM onmouseout Event

Introduction

Execute a JavaScript when moving the mouse pointer out of an image:

The function bigImg() is triggered when the user moves the mouse pointer over the image.

The function normalImg() is triggered when the mouse pointer is moved out of the image.

<!DOCTYPE html>
<html>
<body>

<img onmouseover="bigImg(this)" 
     onmouseout="normalImg(this)" 
     border="0" 
     src="image3.png" 
     alt="Circle" 
     width="32" 
     height="32">

<script>
function bigImg(x) {//from www  . ja v  a2 s  .c o  m
  x.style.height = "64px";
  x.style.width = "64px";
}

function normalImg(x) {
  x.style.height = "32px";
  x.style.width = "32px";
}
</script>

</body>
</html>

The onmouseout event occurs when the mouse pointer is moved out of an element, or out of one of its children.

Bubbles: Cancelable: Event type: Supported HTML tags:	Yes Yes MouseEvent All HTML elements, EXCEPT: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, and <title>

Previous Next

Javascript DOM onmouseout Event

Introduction

Related