純css實現鼠標移動方向遮罩效果

在codepen上看到一款css效果，很不錯    根據鼠標進入框的方向的不同，遮罩進入的方向也不同。 自己思考如何判斷鼠標進入的方向，沒有事件可以直接獲取進入元素的方向，雖然可以用鼠標座標計算，但是太麻煩。直接用純css就可以實現 原理   首先定位4個不同方向的遮罩，然後給每個遮罩添加僞元素before      上圖中黑框內不同顏色的地方就是每個遮罩的before，鼠標從某個方向進入時，必定

>>阅读原文<<