SuiNav移动自适应导航

SuiNav

兼容Bootstrap，不依赖Bootstrap；

JQuery插件版，需要引入JQuery文件；

使用方法：

<script type="text/javascript">

    $('#sui_nav').SuiNav({

        toggleName: '.MenuToggle', // 控制菜单开关类

        direction: 'left', // 菜单切换方向

        trigger: 'click', // 展开方式，单击展示下层或是悬浮展示

        openingSpeed: 400, // 打开菜单动画时间

        closingSpeed: 400, // 关闭菜单动画时间

        closingCascade: true, // 级联关闭所有菜单，仅对垂直导航菜单有效

        destroy: true // 切换菜单时是否释放控件占用资源

    });

</script>

HTML样式：

通过创建一个菜单，可以同步创建垂直导航或水平导航，垂直导航或水平导航在一定的分辨率下自动转为侧滑导航；

.sui-nav 默认为垂直导航，为 .sui-nav 添加 .horizontal 后转为水平导航；

垂直导航、水平导航在分辨率<=768px时自动隐藏，转为侧滑导航;

.hide-in-horizontal 仅在垂直导航中显示，包括侧滑导航;

.show-in-horizontal 仅在水平导航中显示;

.hide-in-mobile 仅在>768px的屏幕显示;

.show-in-mobile 仅在<=768px的屏幕显示;

目前还在完善中，详细文档链接请查看website

搜索发现

下载榜观看榜