Getting the position of a mouse when its clicked

  • tastysite
  • Proficient
  • Proficient
  • User avatar
  • Posts: 349
  • Loc: Brighouse, West Yorkshire, England

Post 3+ Months Ago

What I want to do is get the x,y (or its it top and right im not sure) position of the mouse when it is click. Then saving it to a variable so I can add it to mysql im sure it can be done in js but not sure where to start.
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • UPSGuy
  • Lurker ಠ_ಠ
  • Web Master
  • User avatar
  • Posts: 2733
  • Loc: Nashville, TN

Post 3+ Months Ago

Code: [ Select ]
<html>
    <head>
        <script type="text/javascript">
            
            window.onload = init;
            function init() {
                if (window.Event) {
                    document.captureEvents(Event.MOUSEMOVE);
                }
                document.onmousedown = getPosition;
            }

            function getPosition(e) {
                xPos = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
                yPos = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
                
                alert("X: " + xPos + " Y: " + yPos);
            }
            
        </script>
    </head>
    <body>
            
    </body>
</html>
  1. <html>
  2.     <head>
  3.         <script type="text/javascript">
  4.             
  5.             window.onload = init;
  6.             function init() {
  7.                 if (window.Event) {
  8.                     document.captureEvents(Event.MOUSEMOVE);
  9.                 }
  10.                 document.onmousedown = getPosition;
  11.             }
  12.             function getPosition(e) {
  13.                 xPos = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
  14.                 yPos = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
  15.                 
  16.                 alert("X: " + xPos + " Y: " + yPos);
  17.             }
  18.             
  19.         </script>
  20.     </head>
  21.     <body>
  22.             
  23.     </body>
  24. </html>


Tested in FF3.5 and IE7. This gets you the position, but there's a few different ways to go about persisting those values to a DB, so that depends on your needs. If you need it to be snappy, then you could wire up an ajax call to your favorite SS language and save it that way.

Post Information

  • Total Posts in this topic: 2 posts
  • Users browsing this forum: No registered users and 105 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.