Open In App
Related Articles

HTML | DOM MouseEvent screenX Property

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Report issue
Report
The MouseEvent screenX property is used for returning the horizontal coordinate of the mouse pointer whenever this event is triggered. It returns a number which represents the horizontal distance of the mouse pointer relative to the screen in pixels. The MouseEvent screenX property is a read-only property and it returns a number which represents the horizontal coordinate of the mouse pointer in pixels. Syntax :
event.screenX
Below program illustrate the MouseEvent screenX property : Program: Finding out the horizontal coordinates of the mouse pointer, relative to the screen, when the mouse button is clicked on an element.
<!DOCTYPE html>
<html>
<head
    <title>MouseEvent screenX Property in HTML</title
    <style
        h1 
        
            color:green; 
        
      
        h2
        {
            font-family: Impact;
        }
      
        body 
        
            text-align:center; 
        }
    </style
</head>
  
<body>
    <h1>GeeksforGeeks</h1
    <h2>MouseEvent screenX Property</h2>
      
    <p onclick="coord(event)">
        Click somewhere in the paragraph to 
        get the x(horizontal) coordinates of 
        the mouse pointer.
    </p>
      
    <p id="test"></p>
      
    <script>
        function coord(event) 
        {
            var x = event.screenX;
            var coords = " X coords: " + x;
            document.getElementById("test").innerHTML = coords;
        }
    </script>
</body>
</html>                                      

                    
Output: After clicking the button Supported Web Browsers
  • Opera
  • Internet Explorer
  • Google Chrome
  • Firefox
  • Apple Safari


Last Updated : 31 Jan, 2019
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads