当前位置:Gxlcms > JavaScript > 基于Jquery代码实现手风琴菜单_jquery

基于Jquery代码实现手风琴菜单_jquery

时间:2021-07-01 10:21:17 帮助过:7人阅读

先给大家展示效果图:

先看页面代码,列表的嵌套:

 css 代码,主要设置背景色和子菜单左边框的样式,设置悬浮和选中的样式,开始设置子菜单不显示(通过 js 设置点击之后再显示):

  接下来就是点击事件的代码:

需要注意的是列表嵌套,会导致事件冒泡,所以在子菜单的点击事件里面要组织冒泡,event.stopPropagation();

以上代码很简单,代码就是注释,jquery手风琴菜单就实现了。需要的朋友快来参考下吧。

人气教程排行