实现京东的无延迟的菜单的效果
自己做过很多的下拉菜单的效果,其中因为项目需要自己就去学了京东的无延迟菜单的制作。
下面请看其中的代码:
京东无延迟效果
- 1
- 2
- 3
- 4
- 1>
- one
- 2>
- one
- 3>
- one
- 4>
- one
如果你们仔细看其中的前端中的html的代码,你不难发现其中一级菜单中用的是data-id,在二级菜单里面用的是id,其中存在的对应关系相信你们也注意到了吧!正因为这个对应关系在其中我们才会用到jq里面的data("id")这个方法了,剩下的就是其中的对于其中的active和none类的添加和删除了从而改变其中样式。
你也可以看到其中的注释里面的东西,写到一个防抖的东西,这里就是用到了其中的定时器进行延迟来解决其中的防抖的。
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
