mdui实现抽屉式弹出菜单效果代码
代码语言:html
所属分类:菜单导航
代码描述:mdui实现抽屉式弹出菜单效果代码,适合pc端和手机端
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>抽屉栏导航 - 通过 JavaScript 调用</title> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/mdui.min.css"> </head> <body class="mdui-drawer-body-left" style="padding-top: 20px;"> <div class="mdui-drawer" id="drawer"> <ul class="mdui-list"> <li class="mdui-list-item mdui-ripple"> <i class="mdui-list-item-icon mdui-icon material-icons">move_to_inbox</i> <div class="mdui-list-item-content">Inbox</div> </li> <li class="mdui-list-item mdui-ripple"> <i class="mdui-list-item-icon mdui-icon material-icons">star</i> <div class="mdui-list-item-content">Starred</div> </li> <li class="mdui-list-item mdui-ripple"> <i class="mdui-list-item-icon mdui-icon material-icons">send</i> <div class="mdui-list-item-content">Sent mail</div> </li> <li class="mdui-list-item mdui-ripple"> <i class="mdui-list-item-icon mdui-icon material-icons">drafts</i> <div class="mdui-list-item-content">Drafts</div> </li> <li class="mdui-subheader">Subheader</li> <li class="mdui-list-item mdui-ripple"> <i class="mdui-list-item-icon mdui-icon material-icons">email</i> <div class="mdui-list-item-content">All mail</div> </li> <li class="mdui-list-item mdui-ripple"> <i class="mdui-list-item-icon mdui-icon material-icons">delete</i> <div class="mdui-list-item-content".........完整代码请登录后点击上方下载按钮下载查看
网友评论0