2 Replies - 2102 Views - Last Post: 17 November 2009 - 11:44 AM

#1 FifoK  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 16-November 09

Cursor position / pageX, pageY /

Post icon  Posted 16 November 2009 - 10:33 AM

Hi there, I have this code here.. What I want to do is when the user clicks anywhere on the page, the forms X and Y receive the position of the cursor.
Thank you for your time!
<!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>

  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <title>javascript event capture</title>

<script type="text/javascript"><!--

function coords() {
 x = pageX;
 y = pageY;
}
function init() {
coords();
var x = document.getElementById("posnx");
var y = document.getElementById("posny");
}
//--></script>
</head>
<body onclick="init()">

<form  name="onsubmit="return false">

  X = <input id="posnx" type="text">
  
  
  Y = <input id="posny" type="text">

</form>

<div style="height: 600px;">

  Click somewhere

</div>



</body></html>



There is obviously something missing.. but I' m too 'new' to find out what.

This post has been edited by FifoK: 16 November 2009 - 10:35 AM


Is This A Good Question/Topic? 0
  • +

Replies To: Cursor position / pageX, pageY /

#2 ahmad_511  Icon User is offline

  • MSX
  • member icon

Reputation: 131
  • View blog
  • Posts: 722
  • Joined: 28-April 07

Re: Cursor position / pageX, pageY /

Posted 16 November 2009 - 12:27 PM

hi,
first of, in the init() function you're not assigning the values of x,y to the text boxes, you're simply assigning the text boxes objects to the x,y

try it like this:
<!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>

  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
  <title>javascript event capture</title>

<script type="text/javascript"><!--

function coords(e) {
var x = e.clientX;
var y = e.clientY;
document.getElementById("posnx").value=x;
document.getElementById("posny").value=y;
}

//--></script>
</head>
<body onclick="coords(event)">

<form  name="onsubmit="return false">

  X = <input id="posnx" type="text">
   
   
  Y = <input id="posny" type="text">

</form>

<div style="height: 600px;">

  Click somewhere

</div>



</body></html>


hope it's what you're looking for
Was This Post Helpful? 0
  • +
  • -

#3 FifoK  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 16-November 09

Re: Cursor position / pageX, pageY /

Posted 17 November 2009 - 11:44 AM

I' ve tried this method wow but there was obviously something wrong with the scope of the variables. Thanks for the help! A really useful forum btw! :]
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1