Resources:
Yin Xin Blog: http://sentsin.com/web/112.html,
Math.atan2 (y,x) Explanation: http://www.w3school.com.cn/jsref/jsref_atan2.asp;
Demo:demo
:
Code:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Postscript:
In fact, the core code is to use the Yin Heart Blog Code, the explanation is also relatively clear.
1. Be aware that the parent container has squares and rectangles so to calculate a proportional relationship, the value of x, y is calculated;
2.math.atan2 (y, x) returns the angle from the x-axis to point (x, y), which actually returns radians and then turns into an angle at * 180/MATH.PI;
3. As for + 180)/90) + 3)% 4 +180 is for the reversal of the angle, except 90 is the average divided into four parts +3 in fact, in order to%4 to find out 0,1,2,3;
Presumably the logic is this, can also have a personal understanding of the wrong way, welcome to point out;
To determine the direction of the mouse into the container small demo