Advanced Search

position div with mouse coords (onClick event)

/ Published in: JavaScript
Save to your folder(s)
On click event, display a div on mouse coords.
Tested on Firefox 3.6.11, chrome 6, internet explorer 6.
Based on this source code: http://www.webdeveloper.com/forum/showthread.php?t=92007

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title>Aratti@py</title>
  5.  
  6. <script language="JavaScript" type="text/JavaScript">
  7.  
  8. function checkS(e){
  9. // capture the mouse position
  10.     var posx = 0;
  11.     var posy = 0;
  12.     if (!e) var e = window.event;
  13.     if (e.pageX || e.pageY)
  14.     {
  15.         posx = e.pageX;
  16.         posy = e.pageY;
  17.     }
  18.     else if (e.clientX || e.clientY)
  19.     {
  20.         posx = e.clientX;
  21.         posy = e.clientY;
  22.     }
  23.  
  24. 	document.getElementById('pos').innerHTML = 'Mouse position is: X='+posx+' Y='+posy;
  25. 	document.getElementById('pos').style.left = posx;
  26. 	document.getElementById('pos').style.top = posy;
  27. 	document.getElementById('pos').style.display='block';
  28. }
  29. </script>
  30.  
  31. </head>
  32.  
  33. <body onClick="checkS(event)">
  34.  
  35. <div id="pos" style="position:absolute; display:none;">test</div>
  36. </body>
  37. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.