资讯专栏INFORMATION COLUMN

文章目录自动生成器

felix0913 / 3260人阅读

摘要:提供一个插件,可以实现的文章目录效果啦不止点击跳转还滚动激活当前链接地址使用很简单文章容器目录容器支持以上和主流的浏览器文章容器,选择器目录容器,选择器每个目录项的类当前激活的目录项的类可选选择目录的标题元素,

提供一个插件,可以实现segmentfault的文章目录效果啦~~

不止点击跳转还滚动激活当前链接

demo地址

使用很简单


new Katelog({
    contentEl: "kCatelog",
    catelogEl: "catelogList",
    linkClass: "k-catelog-link",
    linkActiveClass: "k-catelog-link-active",
    supplyTop: 20,
    selector: ["h2", "h3"],
    active: function (el) {
        console.log(el);
    }
});

支持IE8以上和主流的浏览器

contentEl

文章容器,id选择器

catelogEl

目录容器,id选择器

linkClass

每个目录项的类

linkActiveClass

当前激活的目录项的类

selector(可选)

选择目录的标题元素,默认支持6级树形结构

默认值: ["h1", "h2", "h3", "h4", "h5", "h6"]

selector: ["h2", "h3"]

supplyTop(可选)

每个目录需要补充的高度,比如fixed头部布局会挡住实现,可以设置supplyTop来修正

如果对你有用的话,给个小星星吧!https://github.com/KELEN/k-ca...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/52691.html

相关文章

  • Markdown 的文章目录在 Vim 里的终极解决方案

    摘要:目前支持的解析引擎更新已经存在的文章目录。生成链接风格的文章目录。默认值用于控制保存文件时是否自动更新已有文章目录。我使用的与相关的插件解决文章目录的问题。 如果你使用 Vim 编辑 Markdown,而且也为如何生成和更新文章目录(Table of Contents)而烦恼,那么如下的内容将带你脱离刀耕火种手写 Toc 的体验,回归使用 Markdown 是为了专注于内容的初心。 一...

    cpupro 评论0 收藏0
  • 一个骚气的文章目录自动成器了解一下

    摘要:左边的边栏线则是使用的来画出来的,根据层级相应做一些调整,辅以的的效果就可以呈现出不错的移动效果。 这个插件根据选定的目录内容中的 h1, h2, h3, h4, h5, h6 标签来自动生成目录插入到选定的目录容器中,并且提供一个漂亮的样式效果 监听内容区滚动 点击跳转功能 兼容性:IE10+ (由于使用了 node.classList) 地址戳这里 github地址,欢迎sta...

    Cympros 评论0 收藏0
  • 文章目录自动成器

    摘要:提供一个插件,可以实现的文章目录效果啦不止点击跳转还滚动激活当前链接地址使用很简单文章容器目录容器支持以上和主流的浏览器文章容器,选择器目录容器,选择器每个目录项的类当前激活的目录项的类可选选择目录的标题元素, 提供一个插件,可以实现segmentfault的文章目录效果啦~~ 不止点击跳转还滚动激活当前链接 demo地址 使用很简单 new Katelog({ con...

    CloudDeveloper 评论0 收藏0
  • 如何利用showdoc自动生成API文档

    摘要:仿照此种写法,在你的项目中插入类似的注释,也能达到自动生成文档的效果。执行以下命令,脚本会自动递归扫描本目录和子目录的所有文本代码文件,并生成文档。如果是,程序会自动进行格式化展示。 介绍 showdoc是一个适合IT团队的文档工具,阅读本文前需要对showdoc有基本了解 。基本介绍可看:https://www.showdoc.cc/help 对于写API文档这件事,虽然说文本编辑...

    linkin 评论0 收藏0
  • 如何利用showdoc自动生成API文档

    摘要:仿照此种写法,在你的项目中插入类似的注释,也能达到自动生成文档的效果。执行以下命令,脚本会自动递归扫描本目录和子目录的所有文本代码文件,并生成文档。如果是,程序会自动进行格式化展示。 介绍 showdoc是一个适合IT团队的文档工具,阅读本文前需要对showdoc有基本了解 。基本介绍可看:https://www.showdoc.cc/help 对于写API文档这件事,虽然说文本编辑...

    周国辉 评论0 收藏0

发表评论

0条评论

felix0913

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<