Databases
StackOverflow2013
Postsdbo
POjquery trying to achieve mouse direction & angle
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjquery trying to achieve mouse direction & angle
    primarykey
    data
    text
    <p>Im trying to do a mouse direction + angle script just like the game "Pixel". I want to be able to move the element around with my mousemove event and have the element feel the direction and point its tip towards it. I cant seem to understand how the method works, I tried several different approaches to figure out the direction of the mouse movement to an angle but none worked. Here is an example of the game, of course its in flash but the method should be possible in jquery. <a href="http://www.agame.com/game/pixel.html" rel="nofollow">http://www.agame.com/game/pixel.html</a></p> <p>if anyone every came across a jfiddle for this or knows a good approach let me know.</p> <p>EDIT*</p> <p>I tried this below and it almost works but only when the direction of the mouse is moved left and right. Up and down seems to be in-versed and flipped</p> <pre><code>var follow = $(".you"); var xp = 0, yp = 0; var loop = setInterval(function(){ xp += (mouseX - xp) / 5; yp += (mouseY - yp) / 5; follow.css({left:xp, top:yp}); }, 15); var lastx = 0; var lasty = 0; var img = $('.you'); var offset = img.offset(); function mouse(evt){ var mouse_x = evt.pageX; var mouse_y = evt.pageY; var degree=getDirection(lastx,lasty,mouse_x,mouse_y); lastx=mouse_x; lasty=mouse_y; img.css('-moz-transform', 'rotate('+degree+'deg)'); img.css('-webkit-transform', 'rotate('+degree+'deg)'); img.css('-o-transform', 'rotate('+degree+'deg)'); img.css('-ms-transform', 'rotate('+degree+'deg)'); } $(".field").mousemove(mouse); function getDirection(x1, y1, x2, y2,ns) { var dx = x2 - x1; var dy = y2 - y1; return (Math.atan2(dx, dy) / Math.PI * 180); } </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USZakukashi
    1. USZakukashi
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COWhat methods have you tried?
      singulars
      1. POjquery trying to achieve mouse direction & angle
      1. USAsh Burlaczenko
    2. COhttp://docs.jquery.com/Tutorials:Mouse_Position Everything you need to know.
      singulars
      1. POjquery trying to achieve mouse direction & angle
      1. USBrad
    3. CO@brad I can track the position thats not the problem. Im trying to find its direction of movement so that I can set its image angle.
      singulars
      1. POjquery trying to achieve mouse direction & angle
      1. USZakukashi
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload