多级手风琴下拉菜单插件metisMenu.js

多级手风琴下拉菜单插件metisMenu.js源码下载

看看谁在用

查看文件结构

文件大小:0.01M

资源分类: 插件-导航和菜单

更新时间: 2020-12-20

metisMenu.js是一个纯JavaScript导航菜单插件,可以帮助你创建响应式,动画,手风琴/下拉菜单导航。

主要特色
  • 光滑的折叠/展开动画。
  • 启用AJAX。
  • 兼容的桌面和移动。
  • 事件处理程序。
  • 基于animate.css自定义动画。
默认初始化
document.addEventListener("DOMContentLoaded", function(event) {
  new MetisMenu('#example');
});
自定义参数
document.addEventListener("DOMContentLoaded", function(event) {
  new MetisMenu('#example',{
      // 父级元素
      parentTrigger: "li",
      // 子菜单元素
      subMenu: "ul",
      // 自动展开
      toggle: true,
      // 触发元素
      triggerElement: "a"
  });
});
事件处理
document.addEventListener("DOMContentLoaded", function(event) {
  new MetisMenu('#example')
    .on('show.metisMenu', function(event) {    
        console.log(event.detail.showElement);
    })
    .on('shown.metisMenu', function(event) {
        console.log(event.detail.shownElement);
     })
    .on('hide.metisMenu', function(event) {
        console.log(event.detail.hideElement);
    })
    .on('hidden.metisMenu', function(event) {
        console.log(event.detail.hiddenElement);    
    });
});
API方法
onst mm = new MetisMenu("#menu");
 // 停止和销毁菜单
 mm.dispose();
 // 更新菜单
 mm.update();

多级手风琴下拉菜单插件metisMenu.js

正在加载文件目录...

也许你还喜欢

  1. jquery左侧折叠菜单控制右侧内容区域
  2. jquery电商分类导航特效
  3. Bootstrap样式垂直手风琴菜单
  4. jQuery手机端3D折叠菜单插件
  5. Accordion自定义手风琴垂直菜单代码
  6. 炫酷Bootstrap垂直手风琴CSS3折叠菜单插件
简约创意和现代设计HTML电子商务模板
  • 标签查找|关于我们|格式化工具|bootstrapmb.com 版权所有 苏ICP备17077179号-2