Hi Joe,
My name is Allen Chen. It's my pleasure to work with you on this issue.
From your description you want to get the relative mouse position to an
element on the page. If so we can use JavaScript to get the position and
minus the position of the element to get the result we need. Below is the
demo that demonstrates how to do that:
Aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs"
Inherits="Javascript_Mouse_Position_lvl_200._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<script type="text/javascript">
function ShowPosition(obj, e,id) {
var e = (typeof event != 'undefined') ? window.event : e; // IE
: Moz
var relativeto = document.getElementById(id);
var relativex = getX(relativeto);
var relativey = getY(relativeto);
var s;
if (e.clientX) {
s = (e.clientX - relativex) + "X" + (e.clientY - relativey);
}
else {
var p = e.currentTarget.clientLeft;
s = (p.clientLeft - relativex) + "X" + (p.clientTop -
relativey);
}
document.getElementById("Text").innerHTML = s;
}
function getY(oElement) {
var iReturnValue = 0;
while (oElement != null) {
iReturnValue += oElement.offsetTop;
oElement = oElement.offsetParent;
}
return iReturnValue;
}
function getX(oElement) {
var iReturnValue = 0;
while (oElement != null) {
iReturnValue += oElement.offsetLeft;
oElement = oElement.offsetParent;
}
return iReturnValue;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div >
<table>
<tr>
<td colspan="2">
occupy some room..</td></tr>
<tr>
<td>occupy some room..</td>
<td>
<asp
anel Width="200" Height="200" BackColor="Yellow" ID="Panel1"
runat="server">
</asp
anel>
</td>
</tr>
</table>
<div id="Text"></div>
</div>
</form>
</body>
</html>
Aspx.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Javascript_Mouse_Position_lvl_200
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
this.Panel1.Attributes.Add("onmousemove","ShowPosition(this,event,'Panel1')"
);
}
}
}
To test, please move your mouse over the yellow Panel. You'll see the
position shown on the page.
Please let me know if it works and feel free to ask if you have additional
questions.
Regards,
Allen Chen
Microsoft Online Support
Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we can improve the support we provide to you. Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
(e-mail address removed).
==================================================
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/en-us/subscriptions/aa948868.aspx#notifications.
Note: MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response from the community or a Microsoft Support
Engineer within 2 business day is acceptable. Please note that each follow
up response may take approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution. The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions. Issues of this
nature are best handled working with a dedicated Microsoft Support Engineer
by contacting Microsoft Customer Support Services (CSS) at
http://msdn.microsoft.com/en-us/subscriptions/aa948874.aspx
==================================================
This posting is provided "AS IS" with no warranties, and confers no rights.
