CSS only Direction Aware Hover - Oct 2013 Modern browsers only

with contributions from Francky.

• This is the message
• This is another message
• Message
• Apart from this message which is longer still
• This is the longest message so far
• Apart from this message which is longer still
• Even more Messages
• This is nearly the last message
• This is the penultimate message
• Finally as the end of the messages

Move your mouse slowly across the image from one of 4 directions (North, East, West,South) and the overlay message will fly in from that side.

IE9 and under (down to IE6) just get a hover effect and no animation.