Tocify动态生成左侧智能定位导航

Tocify是一个能够动态生成菜单导航的jQuery插件。比如有一篇很长的文章，文章有多个节点，那么使用Tocify可以根据节点元素动态生成文章目录，点击目录可以平滑的滚动到相应的节点。另外Tocify还支持移动端浏览器哦！~

分类：悬浮层/弹出层 > 悬浮层难易：中级

查看演示下载资源下载积分： 20 积分

内容节点，h2一级菜单,h3是对应子级

<div class="wrap"> 
    <h1>Tocify</h1> 
    <br /> 
    <section> 
        <h2>网站模板</h2> 
        <p>内容</p> 
    </section> 
    <br /> 
    <section> 
        <h2>网页特效</h2> 
        <p>内容</p> 
        <h3>导航菜单</h3>
        <h3>客服代码</h3>
    </section> 
</div>

引入tocify相关插件

<link type="text/css" rel="stylesheet" href="jquery.tocify.css" /> 
<link type="text/css" rel="stylesheet" href="bootstrap.css" /> 
<script src="jquery-1.7.2.min.js"></script> 
<script src="jquery-ui-1.9.1.custom.min.js"></script> 
<script src="jquery.tocify.min.js""></script>

创建一个生成菜单的地方，样式你可以自定义

<div id="toc"></div>

tocify生成动态导航菜单

$(function() { 
  $("#toc").tocify(); 
});