jQuery SideMenu 插件


前言

介绍

介绍1

由于博客都是使用 markdown 来写的,有时候文章比较长就很麻烦。

因为没有导航,所以就想着自己生成导航,这样子既方便阅读又方便操作。

介绍2

看到百度百科的导航做的还不错,就直接模仿做成 jQuery 的插件了。

开始体验

那么,以这篇文章为例,让我们一起来 下这个插件吧。

使用

使用非常简单,不用修改原来的任何代码,只要加上插件的使用就可以了。

源码已经放到 github 上,完全开源,哈哈, 支持的话,欢迎给个 star 或者 fork 这个 repo

引入样式

<link rel="stylesheet" href="side-menu.css" />
          

引入脚本

<script src="jquery.min.js"></script>
<script src="jquery.side.menu.js"></script>
<script>
$(function() {
    $('#main').sideMenu();
});
</script>
          

API

参数

container

表示将目录放到什么元素下,字符串。
格式为 jQuery 元素,例如 '#menu'、'.my-menu',默认为 body。

hs

表示需要生成目录的标题列表,数组。
默认为 ['h2', 'h3', 'h4'],根据 h2、h3、h4 来生成目录。

例子

$('#main').sideMenu({
    container: '#menu',
    hs: ['h2', 'h3', 'h4', 'h5']
});
          

关于

出于兴趣与对 web 新鲜技术的热爱,经常在 github 上练练级,希望你也可以用到这个插件。

由于是第一版,所以可能还有一些问题的存在,以及需要完善的地方,假如觉得有用或者有什么问题,可以给我留言。