docsify实现代码折叠

前言

docsify是一款神奇的文档生成利器!提供一个index.html进行配置,其他的说明文档完全可以通过md文件去写,使说明文档可以只专注于md的编写。

插件

docsify拥有活跃的社区,也攒下了很多比较好的插件。今天我们要介绍的是一个可以折叠代码的插件。
在说明文档中可能会有较长的代码,以至于说明文档太过长,对于阅读来说不太友好,那么docsify-hide-code插件就比较好的解决了这个问题。

你可以设置折叠高度,当代码块儿超出此长度将会被折叠,点击展开即可查看所有代码。还提供了是否滚动选项,可以滚动查看代码。

使用

在docsify之后,将以下脚本标记添加到你的index.html中。

<script src="https://unpkg.com/docsify-hide-code"></script>

也可以使用以下脚本。

<script src="https://cdn.jsdelivr.net/npm/docsify-hide-code/dist/docsify-hide-code.min.js"></script>

参数

window.$docsify = {
    hideCode: {
        scroll: false, // 启用滚动
        height: 300 // 折叠高度
    }
}

你可能感兴趣的:(前端,前端,javascript,docsify,代码折叠)