设为首页收藏本站
开启辅助访问 切换到宽版
快捷导航 发布信息
搜索
搜索附件  
自丢网 › 附件中心 › 模板下载 › 网页特效 › 菜单导航代码 ›js css3手风琴展开收缩下拉菜单代码.zip

板块导航

热门下载

左侧广告
版权所有：自丢网
For 2020-2050 © zidiu.com

js css3手风琴展开收缩下拉菜单代码.zip

 

js+css3手风琴展开收缩下拉菜单代码:


这是一款扁平化风格js+css3手风琴展开收缩下拉菜单代码，带小图标，支持多级子菜单。

  1. js代码

  3. <script>
  4. var list = document.querySelectorAll('.list');

  6. function accordion(e) {
  7.     e.stopPropagation();
  8.     if (this.classList.contains('active')) {
  9.         this.classList.remove('active');
  10.     } else
  11.     if (this.parentElement.parentElement.classList.contains('active')) {
  12.         this.classList.add('active');
  13.     } else
  14.     {
  15.         for (i = 0; i < list.length; i++) {
  16.             list[i].classList.remove('active');

  18.         }
  19.         this.classList.add('active');
  20.     }
  21. }
  22. for (i = 0; i < list.length; i++) {
  23.     list[i].addEventListener('click', accordion);
  24. }
  25. </script>
复制代码