实现京东的无延迟的菜单的效果

自己做过很多的下拉菜单的效果,其中因为项目需要自己就去学了京东的无延迟菜单的制作。

下面请看其中的代码:



京东无延迟效果


  • 1
  • 2
  • 3
  • 4
1>
one
2>
one
3>
one
4>
one

如果你们仔细看其中的前端中的html的代码,你不难发现其中一级菜单中用的是data-id,在二级菜单里面用的是id,其中存在的对应关系相信你们也注意到了吧!正因为这个对应关系在其中我们才会用到jq里面的data("id")这个方法了,剩下的就是其中的对于其中的activenone类的添加和删除了从而改变其中样式。

你也可以看到其中的注释里面的东西,写到一个防抖的东西,这里就是用到了其中的定时器进行延迟来解决其中的防抖的。


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部