这是一个js实现京东无延迟菜单效果,感觉很好,分享给大家...
先来理清思路:
1.开发基本的菜单结构
3.假如延迟解决移动问题,切换子菜单时候,用setTimeout设置延迟
debounce去抖技,在事件被频繁触发是,只执行一次处理
4.解决延迟引入的新问题
跟踪鼠标的移动,用鼠标当前位置,和鼠标上一次位置与子菜单上下边缘的三角形区域进行比较
运用到向量
二位向量叉乘公式
用叉乘法判断点在三角形内
最终效果:
鼠标自然的移动和点击到子菜单切换时无延迟
下面开始代码:
开发基本的菜单结构