DavidStrada · March 24, 2017 16:15 · Mar 24, 2017 · Apr 9, 2012
diff --git a/gistfile1 → gistfile1.js b/gistfile1 → gistfile1.js
diff --git a/gistfile1 b/gistfile1
@@ -0,0 +1,34 @@
+$(".overlayLink").bind("mouseenter mouseleave",function(e){
+
+/** the width and height of the current div **/
+var w = $(this).width();
+var h = $(this).height();
+
+/** calculate the x and y to get an angle to the center of the div from that x and y. **/
+/** gets the x value relative to the center of the DIV and "normalize" it **/
+var x = (e.pageX - this.offsetLeft - (w/2)) * ( w > h ? (h/w) : 1 );
+var y = (e.pageY - this.offsetTop  - (h/2)) * ( h > w ? (w/h) : 1 );
+
+/** the angle and the direction from where the mouse came in/went out clockwise (TRBL=0123);**/
+/** first calculate the angle of the point, 
+ add 180 deg to get rid of the negative values
+ divide by 90 to get the quadrant
+ add 3 and do a modulo by 4  to shift the quadrants to a proper clockwise TRBL (top/right/bottom/left) **/
+var direction = Math.round((((Math.atan2(y, x) * (180 / Math.PI)) + 180 ) / 90 ) + 3 )  % 4;
+
+
+/** do your animations here **/ 
+switch(direction) {
+ case 0:
+  /** animations from the TOP **/
+ break;
+ case 1:
+  /** animations from the RIGHT **/
+ break;
+ case 2:
+  /** animations from the BOTTOM **/
+ break;
+ case 3:
+  /** animations from the LEFT **/
+ break;
+}});