Introduction
In this article, I explain how to get the cursor's location in jQuery.
First we download the file and then add it in our project; see:
Jquery-1.8.2.js
Use the following procedure.
Step 1
Open Visual Studio 2012 and click "File" -> "New" -> "Web Site...". A window is opened. In this window, click "Empty Web Site" under Visual C#.
Give the name of your application as "Cursor_Location" and then click "Ok". Then add "HTML page" and write the following code.
Program Coding
Cursor_Location.htm
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function ()
{
$(document).mousemove(function (e)
{
$('#lblXAxis').html("Cursor X Axis: "+e.pageX+"<br>")
})
})
$(function ()
{
$(document).mousemove(function (e1)
{
$('#lblYAxis').html("Cursor Y Axis: "+e1.pageY)
})
})
</script>
</head>
<body>
<form id="form1" runat="server">
<h3 style="color: #0000FF; font-size: x-large">Cursor Location in Jquery</h3>
<input id="Button1" type="button" value="Mouseover for Get Cursor Location" />
<br />
<br />
<div>
<label id="lblXAxis" style="font-weight: bold; font-size: large" />
</div>
<label id="lblYAxis" style="font-weight: bold; font-size: large" />
</form>
</body>
</html>
Output
![output.jpg]()
For more information, download the attached sample application.