支烟网页侧滑JS插件
先上效果图:
功能介绍:
1.实现手机侧滑导航栏
2.可自动设置左滑还是右滑
3.支持侧滑和遮罩2种
4.使您的网站更加好看
5.让您的网站看上去高端大气上档次
6.使用户更加有体验感
7.一键式滑动
操作步骤:
1.引入插件zyHd.js
2.准备2个容器,一个装隐藏部分一个装显示部分和一个按钮,设置其样式
具体如下:
<body> <!-- 隐藏菜单 --> <div id="hiddenDiv"> 这个是隐藏菜单 </div> <!-- 显示内容 --> <div id="showDiv"> <input id="btn" type="button" value="显示" /> 这是显示的内容 </div> </body>
3.调用zy_zy_init()方法进行初始化,具体操作如下:
zy_init({ menu:"#hiddenDiv",//需要显示的菜单 panel:"#showDiv",//面板 btn:"#btn",//打开关闭按钮 direction:2,//菜单栏方向 1.left或2.right time:200,//打开和关闭时间 type:2//1遮罩方式 2.侧滑方式, });
完成效果图:
实际运用案例如本站手机端
最后奉上地址:http://libs.1zyan.cn/js/zyjs/zyHd.js