jQuery animation for a hover with 'mouse direction'

Question

I\'m trying to simulate the effect where I hover on an image an overlayed semi-transparent image will fade in from the direction where your mouse came from. Vice versa when your

Answer 1

If you swipe your mouse rapidly from left to right so that it crosses 3 rectangles

     [ 1 ] [ 2 ] [ 3 ] 

the mouse will be entering rectangle #3 via its left border div immediately after it has exited rectangle #2 via its right border div. However, the assignment inClass="left" outClass="left" when rectangle #3 is entered via its left border div occurs BEFORE the outHandler for rectangle #2 has fired.