Open In App

HTML | DOM MouseEvent clientY Property

Last Updated : 10 Jun, 2022
Improve
Improve
Like Article
Like
Save
Share
Report

The MouseEvent clientY property is a read-only property which is used to return the vertical coordinate of the mouse pointer based on the current window when a mouse event was triggered.

Syntax :

event.clientY

Return Value: It returns a number that represents the vertical coordinate of the mouse pointer in pixels. 

Below program illustrates the MouseEvent clientY property: 

Finding out the vertical coordinates of the mouse pointer when the mouse button is clicked on an element. 

html




<!DOCTYPE html>
<html>
 
<head>
    <title>MouseEvent clientY Property</title>
    <style>
        h1 {
            color: green;
        }
         
        h2 {
            font-family: Impact;
        }
         
        body {
            text-align: center;
        }
    </style>
</head>
 
<body>
 
    <h1>GeeksforGeeks</h1>
    <h2>MouseEvent clientY Property</h2>
 
    <p onclick="coord(event)">
        To get the y coordinates of the mouse pointer,
        click on this paragraph. </p>
 
    <p id="gfg"></p>
 
    <script>
        function coord(event) {
            var getYcoord = event.clientY;
            var result = "Y coordinate: " + getYcoord;
            document.getElementById("gfg").innerHTML = result;
        }
    </script>
 
</body>
 
</html>
 
                                


Output:

  

After clicking the button

  

Supported Web Browsers:

  • Google Chrome 1 and above
  • Edge 12 and above
  • Opera 12.1 and above
  • Internet Explorer 9 and above
  • Firefox 1.5 and above
  • Apple Safari 1 and above


Previous Article
Next Article

Similar Reads

HTML | DOM MouseEvent screenY Property
The MouseEvent screenY property is a read-only property and used for returning the vertical coordinate of the mouse pointer when an event was triggered. Syntax : event.screenY Return Value: It returns a number which represents the vertical coordinate of the mouse pointer in pixels. Below program illustrates the MouseEvent screenY property: Example:
1 min read
HTML | DOM MouseEvent pageX Property
The MouseEvent pageX property is a read-only property and used for returning the horizontal coordinate of the mouse pointer when an event has triggered. Syntax: event.pageX Return Values: It returns a number which represents the horizontal coordinate of the mouse pointer in pixels. Below program illustrates the MouseEvent pageX property: Example: F
1 min read
HTML | DOM MouseEvent clientX Property
The MouseEvent clientX property is a read-only property which is used to return the horizontal coordinate of the mouse pointer based on the current window when a mouse event was triggered. Syntax: event.clientX Return Value: It returns a number which represents the vertical coordinate of the mouse pointer in pixels. Below program illustrates the Mo
1 min read
HTML | DOM MouseEvent offsetY Property
The MouseEvent offsetY property is a read-only property and is used for returning the y-coordinate of the mouse pointer, relative to the target element. The MouseEvent offsetY property returns a number which represents the vertical coordinate of the mouse pointer, in pixels with respect to the screen. Syntax : event.offsetY Below program illustrate
1 min read
HTML | DOM MouseEvent screenX Property
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 th
1 min read
HTML | DOM MouseEvent pageY Property
The MouseEvent pageY property is a read-only property and used for returning the vertical coordinate of the mouse pointer when an event has triggered. Syntax : event.pageY Return Value: It returns a number which represents the vertical coordinate of the mouse pointer in pixels. Below program illustrates the MouseEvent pageY property: Example: Findi
1 min read
HTML | DOM MouseEvent offsetX Property
The MouseEvent offsetX property is a read-only property which is used for returning the x-coordinate of the mouse pointer, relative to the target element. Syntax : event.offsetX Return Value: It returns a number which represents the horizontal coordinate of the mouse pointer, in pixels. Below program illustrates the MouseEvent offsetX property: Exa
1 min read
HTML | DOM MouseEvent relatedTarget Property
The MouseEvent relatedTarget property is a read-only property and used for returning the element that is related to the element that triggered the mouse event. It can be used to indicate the element the cursor just exited using the mouseover event. It can also be used to indicate the element the cursor just entered using the mouseout event. Syntax
1 min read
HTML | DOM MouseEvent buttons Property
The buttons property of mouse event is used to return a number. The number indicates which mouse button or mouse buttons were pressed when a mouse event was triggered. This property is usually used along with the onmousedown event. This property is read-only. Due to lack of browser support, you may want to look at the button property instead. Synta
2 min read
HTML DOM MouseEvent
The MouseEvent Object handles events that occur when the mouse interacts with the HTML document. There are lots of events that interacts with the HTML document. Mouse Events: Mouse events are the action taken by the user on the web page, like clicking, hovering over, etc. Mouse Events Description onmouseup Occurs when a user releases a mouse button
3 min read
Article Tags :