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

在codepen上看到一款css效果,很不錯 根據鼠標進入框的方向的不一樣,遮罩進入的方向也不一樣。css 本身思考如何判斷鼠標進入的方向,沒有事件能夠直接獲取進入元素的方向,雖然能夠用鼠標座標計算,可是太麻煩。直接用純css就能夠實現html 原理 首先定位4個不一樣方向的遮罩,而後給每一個遮罩添加僞元素before 上圖中黑框內不一樣顏色的地方就是每一個遮罩的before,鼠標從某個方向進入時
相關文章
相關標籤/搜索