HTML | DOM onmouseover event
The DOM onmouseover event in HTML occurs when the mouse pointer is moved onto an element or its children.
Supported Tags: It supports All HTML elements, EXCEPT:
- <base>
- <bdo>
- <br>
- <head>
- <html>
- <iframe>
- <meta>
- <param>
- <script>
- <style>
- <title>
Syntax:
- In HTML:
<element onmouseover="myScript">
- In JavaScript:
object.onmouseover = function(){myScript};- In JavaScript, using the addEventListener() method:
object.addEventListener("mouseover", myScript);Example:
html
<!DOCTYPE html><html><head> <title> DOM onmouseover event </title></head><body> <center> <h1 id="hID"> GeeksforGeeks </h1> <h2> HTML DOM onmouseover event </h2> <script> document.getElementById( "hID").addEventListener( "mouseover", over); document.getElementById( "hID").addEventListener( "mouseout", out); function over() { document.getElementById( "hID").style.color = "green"; } function out() { document.getElementById( "hID").style.color = "black"; } </script> </center></body></html> |
Output:
Supported Browsers: The browsers supported by HTML DOM onmouseover event are listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Apple Safari
- Opera
Please Login to comment...