Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Jan 2008
    Posts
    93
    Thanks
    30
    Thanked 0 Times in 0 Posts

    Detecting direction of mouse movement

    Hello,
    Is there a way to detect the direction that the mouse is moved?

    Thanks,
    Don

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    there is a way to detect the mouse coordinates. Now it's up to you what do you mean by "direction". Direction relative to what?
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <script type="text/javascript">
    var posx;var posy;
    function getMouse(e){
    posx=0;posy=0;
    var e=(!e)?window.event:e;//IE:Moz
    if (e.pageX){//Moz
    posx=e.pageX+window.pageXOffset;
    posy=e.pageY+window.pageYOffset;
    }
    else if(e.clientX){//IE
    if(document.documentElement){//IE 6+ strict mode
    posx=e.clientX+document.documentElement.scrollLeft;
    posy=e.clientY+document.documentElement.scrollTop;
    }
    else if(document.body){//Other IE
    posx=e.clientX+document.body.scrollLeft;
    posy=e.clientY+document.body.scrollTop;
    }
    }
    else{return false}//old browsers
    document.getElementById('myspan').firstChild.data='X='+posx+' Y='+posy;
    }
    document.onmousemove=getMouse
    </script>
    </head>
    <body>
    <span id="myspan">&nbsp;</span>
    </body>
    </html>
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • Users who have thanked Kor for this post:

    dragon6158 (05-14-2008)

  • #3
    Regular Coder Stooshie's Avatar
    Join Date
    Mar 2008
    Location
    Dundee, Scotland
    Posts
    380
    Thanks
    9
    Thanked 39 Times in 39 Posts
    Quote Originally Posted by Kor View Post
    there is a way to detect the mouse coordinates. Now it's up to you what do you mean by "direction". Direction relative to what?
    Presumably relative to the last co-ordinates.

    I'm working on a bit of code. will post shortly.
    Regards, Stooshie
    O

  • #4
    Regular Coder Stooshie's Avatar
    Join Date
    Mar 2008
    Location
    Dundee, Scotland
    Posts
    380
    Thanks
    9
    Thanked 39 Times in 39 Posts
    Ok, try this
    Code:
    <html>
    <head>
    <script type="text/javascript">
    var x;
    var y;
    var old_x;
    var old_y;
    // added below
    var anglerad;
    var anglerad;
    // added above
    function get_coords(event)
    {
    	x=event.clientX;
    	y=event.clientY;
    	yd = (y - old_y);
    	xd = (x - old_x);
    	dxy = (yd/xd);
    	anglerad = Math.atan(dxy);
    	angledeg = (180/Math.PI) * anglerad;
    	document.getElementById("mytext").value = anglerad + " :: " + angledeg;
    	old_x = x;
    	old_y = y;
    
    }
    </script>
    </head>
    
    <body onmousemove="get_coords(event)">
    
    <p>Move the mouse around</p>
    
    <input type="text" id="mytext" style="width:30em;"/>
    
    </body>
    </html>
    --- EDIT ---
    I Have added two lines to the code so all you have to do at any point in the page is refer to anglerad or angledeg in your own code.
    Last edited by Stooshie; 05-14-2008 at 05:50 PM. Reason: added 2 lines of code
    Regards, Stooshie
    O

  • Users who have thanked Stooshie for this post:

    dragon6158 (05-14-2008)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •