杨小杰博客提供免费教程下载和网站搭建技术教程,主要分享和发布网站源码,致力创造一个高质量网络资源教程的分享平台

利用js自动添加文章目录

Young小杰2018-10-18 16:44网站搭建(3)539查询中……小标签: emlog优化 Jquery

前言

看到孟坤大佬博客里的文章目录很心动,所以百度找了一下这个js,试了一下,很好看。

教程

1、下载附件中的js和css文件

2、上传到模版文件夹或者根目录

3、在文章页面(Emlog是echo_log.php)中引入css和js

4、js加载请使用以下几种代码

$("#autoMenu").autoMenu({
    levelOne : 'h3', //一级标题
    levelTwo : 'h4',  //二级标题(暂不支持更多级)
    width : 200, //容器宽度
    height : 400, //容器高度
    padding: 20, //内部间距
    offTop : 100 //滚动切换导航时离顶部的距离
});
或者
<div class="autoMenu" id="autoMenu" data-autoMenu></div>

预览


博客文章目录.png

说明

第二种加载方式会匹配网站所有h标签,可能会出现一些不必要的,请使用第一种加载方式。

该插件需要juqery支持。


jquery.autoMenu大小:3.4KB | 来源:本地下载 | 下载次数:



发表评论:

发表评论:

  • avatar
    浪子 Lv 1

    ##私密评论仅博主可见##

  • avatar

    按钮不能移动?

    • Young小杰 站长

      回复了晓超云博客:自己用css调整呗,小问题